Archived topic

problems with mobile presentation of text

5 replies · Started by Kenneth on September 13, 2022

Viewing posts 1–6 of 6

September 13, 2022 at 8:52 am #2341863

Hello,

Love GeneratePress. I have a problem that I am sure could be fixed with CSS but I do not know where to look for the answer.

On the pages https://www.thehumaneexperience.org/introduction/ and https://www.thehumaneexperience.org/witnessing-kindness/, for example, the text aligns perfectly on desktop and tablet, but mobile phone version text to right of image is hard to read properly. Is there a way with CSS to adjust the text so that it is easily readable?

I you can kindly point me in the right direction I would be so grateful,

Kind regards,

Kenneth

And thanks again for GeneratePress!

September 13, 2022 at 11:04 am #2341977

Hi Kenneth,

Tyr adding this CSS:

@media (max-width: 768px) {
    .inside-article .wp-block-image [class*="align"] {
        float: none;
    }
}

September 13, 2022 at 2:21 pm #2342101

Thank you Ying,

This works for desktop and tablet. How do I add CSS for only mobile phone?

September 13, 2022 at 4:08 pm #2342150

Oops, I forgot to add the media query, updated the CSS :)

September 13, 2022 at 5:15 pm #2342177

Worked beautifully. Thank you Ying.

September 14, 2022 at 9:56 am #2342979

You are welcome :)

This archived topic is closed to new replies.