[bug report] minor box-sizing issue

Just wanted to report a minor bug I encountered. Since you are using the HTML and BODY level selectors with a wildcard, you are effectively setting all elements of the page to box-sizing: border-box.

Current code:

body.age-restriction *,
html.age-gate-restricted * {
    box-sizing: border-box
}

When I proceed past the age check and the HTML and BODY classes are removed, the entire document reverts back to it’s original box-sizing as defined in the theme CSS. This causes my layout to snap adjust (as block paddings/widths are recalculated).

Take a look at this short video for an example: https://www.youtube.com/watch?v=IBPpWpjEUKk

Look near the site logo at the top left. Notice that my site wrapper grows outwards once the box-sizing reverts back to my theme’s default.

If you move your box-sizing declaration into the .age-gate-wrapper class, this limits the scope of box-sizing to only elements inside the wrapper and thus eliminates this layout re-drawing upon dismissal of the age gate popup.

Suggested fix:

.age-gate-wrapper,
.age-gate-wrapper * {
    box-sizing: border-box
}

• This topic was modified 5 years, 4 months ago by daveis11.
• This topic was modified 5 years, 4 months ago by daveis11.