Search code examples
csswhitespace

Which whiteSpace option to use for long links?

I have this page: https://tikex.com/hu/buyTicket/elektik-tourist-2022

In mobile the last Google link is not broken, so it stretch over the page. I use pre-wrap but I do not know which other I hsould use instead to break it.

<p className={'p_1'} style={{ whiteSpace: 'pre-wrap', maxWidth: '80vw' }}>
    {buyTicketData?.description}
</p>

enter image description here

enter image description here

Solution

  • You should Try

    word-break: break-all;

    Like this:

    <p className={'p_1'} style={{ wordBreak: 'break-all', maxWidth: 
'80vw' }}>
{buyTicketData?.description}
</p>