Archived topic
Page too wide on mobile screen
3 replies · Started by innerfrench on April 19, 2019
Hi guys,
There seems to be an issue with my homepage on mobile screens. It is too wide and shows a lot of blank space on the right.
On tablet there's also a small gap on the right.
I'm using Elementor, all my sections are "boxed" and I have the GP "default template" for the page attribute.
I think it could be related to the css I added to reduce the size on the comment box, although I don't have it on the HP:
@media (max-width: 1125px) {
#comments {
width: 240px;
margin-left: auto;
margin-right: auto;
}
}
Thanks in advance for your help.
Hugo
Hi there,
i am seeing the issue on pages that don't have the comments form so it can't be ( just ) that being the issue. Some Elements on the page are overflowing the content width and its best if you can figure out which ones and fix them, but you can also use this CSS to block the overflow entirely:
html, body {
overflow-x: hidden;
}
In regards to your comments CSS it would be better to use max-width: 240px; instead of width: 240px;
Found the issue. Thanks for your help, David!
Glad to hear that!