Text cut off on left side on most mobiles

Hi @piotrk87

I see your problem. Your theme has a “pull-right” CSS class which doesn’t work on smaller screens. Maybe try adding this CSS to your child theme (or wherever you’re adding custom CSS):

@media only screen and (max-width: 767px) {
body .pull-right{float:none}
}

if that doesn’t work, try:

@media only screen and (max-width: 767px) {
body .pull-right{float:none!important}
}

I avoid using !important but if you need it, you need it. If your site uses the .pull-right class in other areas, you might want to hone your CSS as follows:

@media only screen and (max-width: 767px) {
.content-wrapper .pull-right{float:none}
}

• This reply was modified 4 years, 10 months ago by Little Package. Reason: Added last code example

Wow, thank you ?? Option 2 works ?? How can I buy you a coffee? ??

Hi @piotrk87

If option 2 worked, I might recommend this to be more careful with the code’s reach:

@media only screen and (max-width: 767px) {
.content-wrapper .pull-right{float:none!important}
}

Option 2 will apply the CSS to every tag with a “pull-right” selector, which could have unintended consequences elsewhere. Keep your eyes open for that possibility.

As far as a coffee… don’t worry about a thing. Enjoy your weekend. ??

Hi @littlepackage,

It still works good on mobiles, but there is a similar problem with tablets. Would you be able to help please? ??

Piotr

@piotrk87 I’m sorry I wish I could help right now but it’s not a good time and I’m very busy. Recommend you check out jobs.wordpress.net! Good luck and stay well.