Archived topic

Row layout height causing layout shift and horizontal scroll bar

1 reply · Started by Sneaky on January 3, 2023

Viewing posts 1–2 of 2

January 3, 2023 at 8:18 pm #2482936

I am trying to rectify an issue that keeps occurring when I use row full widths over a certain min-height causing the horizontal scroll bar and layout to shift

If it is a smaller min-height (e.g. 680) it works fine, but I need it larger. The image size would fit in the height I want but for some reason, I can't get it to not show the bottom scroll bar.

I had the developers my plugin for additional blocks take a look at it and they are saying it is a theme issue. See more info in the private Information below

January 3, 2023 at 8:45 pm #2482942

Hi Sneaky,

The computation for align-full isn't perfect. While a code like this may work to take into account the vertical scrollbar and other stuff for instance:

body.no-sidebar .entry-content .alignfull {
    margin-left: calc((-100vw + 17px) / 2 + 100% / 2);
    margin-right: calc((-100vw + 17px) / 2 + 100% / 2);
}

but it still may not be the best approach.

See Tom's explanation about the issue here: https://generatepress.com/forums/topic/horizontal-scrollbar-on-align-full-items/#post-1771522

He provides solutions there as well.

Wrapping your "align-full" content in a GB Container Block and setting that to align-full instead would be an ideal approach.

This archived topic is closed to new replies.

Start building better websites today.