Line-break text

freiwild

Hi, I have a portfolio grid item. In some teasers the text is too long and runs out on the viewing area. How can I make it so that the text wraps?

https://dev.bauing-schmidt.de/referenzen/

Phil

Hello,

Please, use the following CSS code:

.portfolio-item .hover-desc .entry-title{
   word-break: break-word;
}

Put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.

Best regards

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

freiwild

Thank you! But I miss the Hyphen in the Word Break.

Phil

Sorry, but I do not understand.

Can you tell me what you refer to, please?

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

freiwild

I miss this Line here

Phil

Replace the previous code with this one:

.portfolio-item .hover-desc .entry-title{
word-break: break-word;
hyphens: auto;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

freiwild

Thank you. But this doesn't work.

Phil

It displays for me.

Did you try clearing your browser cache?

Best regards

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

freiwild

In Firefox it works. But not in Safari.

Phil

Please, add "-webkit-hypens: auto;" to that CSS.

.portfolio-item .hover-desc .entry-title{
word-break: break-word;
hyphens: auto;
-webkit-hyphens: auto;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

freiwild

Great, thank you!