Site logo

Archived topic

Image full width Browser Scrollbar

7 replies · Started by Alexander on August 10, 2021

Viewing posts 1–8 of 8

Hi,
when i add a Fullwith image to a page then the Botton Scoll Bar from the browser appear.

How to fix that?
See example at private information.
Thanks Alex

Hi there,

how may pages are you using full width content on ?

I personally would recommend setting those pages Content Container to Full Width:

https://docs.generatepress.com/article/content-container/

Then use the GenerateBlocks Plugin to add Container Blocks, some of which you can set to Full Width and others you can keep contained. This will eliminate any issues with having full width content causing an overflow issue.

Hello David,
Thanks for your effort. But that is not a solution to the problem, but a detour to hide the problem. The problem is still there.

I found out that it is not the picture, but something else is creating the browser Scollbar.
Details in Private Information.

The scrollbar exists because of the CSS WP/GP uses to force a Block to be fullwidth. Different OSes and Browsers deal with full width content differently. For example - i don't have the issue on MacOS Chrome or Safari.

To combat it - the fix is to add this CSS:

body {
    overflow-x: hidden;
}

But i still recommend the method i provided above as the best solution for creating pages with full width content. It will save you a lot of headaches.

Css worked.
Everything else not.
Your recommendation is great. But for this many pages would have to be completely revised. Copy / paste in GenerateBlocks causes serious errors in Wordpress.
Despite GenerateBlocks, the scroll bar was still displayed. So no solution.

So has the CSS fixed the problem?

What issues are you having with Copy / Paste ? I personally have not experienced any problems. Let me know.

Hey,
when i create a new GenerateBlocks countainer and then drag and drop old content into the GenerateBlocks Container i get always white screens.
Any solution?
alex
(sorry for my bad english)

This archived topic is closed to new replies.