-
Posts
-
Hi,
Unfortunately there is something wrong with the word-wrap on my website. (Zeilenumbruch) Long words are not splittet they just interfere into another space:
Is there a way I can change this? On all my pages?
Thank you very much,
Best,
VeronikaHey Veronika,
Thank you for the inquiry.
Adding this css code should break the text by characters instead of words.
#top h1 a, #top h2 a, #top h3 a, #top h4 a, #top h5 a, #top h6 a { word-break: break-all; }Best regards,
IsmaelHi,
I added the code to the child theme and to the custom css. Unfortunately it looks like this now:Hi Veloryana,
Try to change break-all to break-word, the code should look like this:
#top h1 a, #top h2 a, #top h3 a, #top h4 a, #top h5 a, #top h6 a { word-break: break-word; }Best regards,
NikkoHi Nikko,
it is still not working correctly. The splitting is now working with single letters but it ist not grammatically correct. Is there a way to adjust that?
Thank you
Best,
VeronikaHi,
Thank you for the update.
You can also adjust the font size on smaller screens. Please try this css code.
@media only screen and (max-width: 767px) { /* Add your Mobile Styles here */ .html_modern-blog #top .post-entry .post-title, .html_modern-blog .avia-content-slider .slide-entry-title { font-size: 1em; letter-spacing: 1px; word-break: break-word; } }Default font-size value is 2em.
Best regards,
IsmaelHi Ismael,
unfortunately nothing changed after adding the CSS code.
Do you have any recommendations?
Best,
VeronikaHi Veronika,
The code is working properly on mobile.
Try adding this CSS code as well to adjust on tablet/ipad:@media only screen and (min-width:768px) and (max-width:980px) { .html_modern-blog #top #wrap_all .post-entry .post-title, .html_modern-blog #top #wrap_all .avia-content-slider .slide-entry-title { font-size: 16px; } }Hope it helps.
Best regards,
Nikko
- You must be logged in to reply to this topic.