Hi,
On mobile devices, my lines of text aren’t utilizing the available space in a line and breaking to the next line, when more words could fill the space on the prior line. I know word-break will fix this, but of course then I have words being split between two lines. Is there another way? Thanks!
Do you have a link to the page in question so that we can check live?
If not can you post the code you are using for this section including css and html.
I assume you have the vieport meta tag in place?
Hi PaulOB,
I am using a WordPress theme so Im not sure if the viewport meta tag is in place. Also again, this is only a problem on a mobile phone display.
HTML: Since this is a WordPress theme, the HTML just shows as builder module.
CSS:
.processex p{
font-weight: 600!important;
margin: 0!important;
}
@media screen and (max-width: 800px){
.processex {
padding-left: 5%!important;
padding-right: 5%!important;
font-size: 1.2em!important;
}
}
@media screen and (max-width: 800px){
.processex p{
font-weight: 100!important;
}
}
It looks like the problem is in the html, not the css. Someone stuck in a load of s and <br>s which is screwing up the lines.
Remove all s and replace the <br>s with closing and opening <p> tags.
Strange, I don’t see the s in the source, but they are there in Inspect Element. Is that some kind of Wordpress weirdness, some script maybe?
OT: and in the css, why is almost everything !important??
I see the   too now in the Inspect Element, but you are right they aren’t in the source. It probably is WordPress weirdness. The !important are to override the theme body. Sometimes though I might get carried away 
Yes its most likely the non breaking spaces which one of your plugins seems to be adding as they are not in the original html.
(The display on the iphone seems to be ok even with the extra non breaking spaces.)
Ok, I will investigate my plugins. Thank you both for helping diagnose!
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.