[Support request] Post Page Content Mobile Responsiveness Issue

[Anant]

Hi Team,

For the posts on one of my website, the content in top section is not responsive.
I have aligned the image at right and put some text content at left. On desktop it appears fine. But on mobile, it looks weird as the text content gets wrapped within 1 character while the image shows at right.

Can’t it be responsive so that the text content starts showing from below of the image? Here’s a screenshot of image: https://imgur.com/BoWLGvy

I have shared the url in private info. This is with almost each post on website.

[Fernando]

Hi Anant,

That’s a WP Image Block. It’s set to float right which is causing the issue.

Try adding this through Appearance > Customize > Additional CSS:

@media (max-width: 768px){
    .wp-block-image figure.alignright, .wp-block-image figure.alignright img {
    width: 100%;
    float:unset;
    margin-left: unset;
}
}

Alternatively, you can use a GenerateBlocks Image Block instead. With this, you can set different alignments for different views through the settings.

[Anant]

Thanks fernando! This helped.

[Fernando]

You’re welcome, Anant!

[Author]

Posts