- This topic has 5 replies, 3 voices, and was last updated 2 years, 2 months ago by Elvin.
-
AuthorPosts
-
January 5, 2022 at 12:51 pm #2070386Bela
Hi,
I got a content wider than screen notification from Google. I checked all pages, and I found that only on the Blog list page (https://rettegi.com/blog/) and only on Tablet/Mobile I can scroll to right, and a white vertical line appears (example: https://prnt.sc/2661e2m) outside the content.
In addition to the previous error, the header only on this page is malfunctioning and disappears halfway when scrolling (https://prnt.sc/2662ktp).
These two error can work together: https://prnt.sc/2662oxl
I checked the page with inspector, I turned off caching, but I didn’t find the solution.
These two errors appears only on Blog page, other pages works well (for eg: https://rettegi.com/bemutatkozas/).
Please help me, to solve these issues.
Greets,
BelaJanuary 5, 2022 at 5:44 pm #2070557LeoStaffCustomer SupportHi there,
Any chance you can disable all plugins except GP Premium to eliminate conflicts from other plugins first?
If it’s indeed a GP issue then it should happen on all pages and not just the blog page.
Let me know ๐
January 6, 2022 at 12:08 am #2070801BelaHi Leo,
I tried to turn off all plugins, but unfortunately the errors did not go away.
January 6, 2022 at 12:27 am #2070807ElvinStaffCustomer SupportHi Bela,
Something in your sidebar is causing this issue.
It’s the label of the search bar.
You can try adding this CSS to address the issue.
.inside-right-sidebar { overflow-x: hidden; position: relative; }
or this:
label.wp-block-search__label.screen-reader-text { display: none; }
But it may be best to remove the label completely.
January 6, 2022 at 12:49 am #2070820BelaHi Elvin,
thank you very much, for your help! The problem is solved. ๐
An interesting thing is that both the sidebar and the search box are original, no unique changes have been made to them.
January 6, 2022 at 1:00 am #2070826ElvinStaffCustomer SupportIt’s a CSS interaction issue between this one from WordPress core CSS:
.wp-block-search .wp-block-search__label { width: 100%; }
And this one from the theme:
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute!important; width: 1px; word-wrap: normal!important; }
Specifically, the interaction between having the property
position: absolute;
andwidth: 100%;
.No problem. Glad you got it sorted.
-
AuthorPosts
- You must be logged in to reply to this topic.