[Resolved] The content is larger than viewport on mobiles

[Author]

Posts

[Roberto Ciccolella]

I used Toolset Blocks in both troubled pages.

Tell us what you are trying to do?
I had a report from Google Search Console, "the content is larger than viewport on mobiles..."

Is there any documentation that you are following?
Yes, I attached two screenshots.

What is the link to your site?
hidden link

[Waqar Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Hi,

Thank you for contacting us and I'd be happy to assist.

During troubleshooting, I noticed that this CSS style rule from the file "/wp-content/micro-themes/active-styles.css" is setting a fixed width of 950px to the view's results container:

#span-42-1480 .wp-block-toolset-blocks-grid {
	width: 950px !important;
}

This fixed width value is resulting in the container extending beyond the viewport on smaller screens and instead of the fixed value, it would be better to use percentage-based values (%).

I hope this helps and please let me know if you need any further assistance with this.

regards,
Waqar

[Roberto Ciccolella]

Hi Waqar,
My issue is resolved now. Thank you!
It was a wrong CSS code I wrote with Microthemer.
But at mobile view there was no way to align the photo centred in the team page, so with MT I wrote this code to fix the issue:

#wpv-view-layout-1499 .tb-image-frame-none {
text-align: center;
}

If you can tell me where in the backend I can align images at mobile view, it will be great.
Best wishes