[Resolved] Avoid Word Breaks

[scometamus]

Dear GP-team,
how can we avoid word breaks in general, especially in responsive mode.

As seen in attached Screenshot, it breaks the word “Ansprechpartnerin” to “Ansprechpartner” and then “in” which looks weird.

Any chance to fix it?

Thanks

[Ying]

If the word doesn’t wrap, it will create a horizontal scroll, there is just not enough space for such a long word. I shot a small clip for you:
https://www.screencast.com/t/xHiLJDz1I10

I think your best option would be to reduce the font size for mobile.

[scometamus]

I see. That workaround solved it. Thanks! Any idea how to solve it here? (l. a. attached screenshot). I’d love to have it, that the columns/table’s content don’t break lines and just get closer to each other.

[Ying]

Can you upload the screenshot here: https://postimages.org/ and share the link to us?

And could you point us to the table on your site?

[scometamus]

attached

[Ying]

I see, try this CSS:

.gb-container-dd83fe89, .gb-container-3bf54341, .gb-container-a85e1d48 {
    white-space: nowrap;
}

[scometamus]

Oh, that stretches the content and makes it look weird on the right side…

[scometamus]

made a screenshot because i can’t let it stay like that for the client. Any ideas? 🙂

[Ying]

Oh, that stretches the content and makes it look weird on the right side…

Yes, that’s the horizontal scroll I mentioned before.

If you don’t want the word to break, it will create that horizontal scroll as the screen is too narrow to show the full word.

[scometamus]

okay thanks for the info!

[Ying]

No problem 🙂

[Author]

Posts