NO BUG: Overflow-x hidden & overflow-y hidden not working

Bricks Version: 1.5.6
Browser: Opera Latest
OS: Win 11

Hi,

Applying overflow-x or overflow-y to a container via custom CSS outputs overflow-x in the backend and frontend inc dev tools. Have not tested on other elements.

Also, is it possible to add this via the overflow control, or does it just accept (visible / hidden)?

Many thanks

Mick

1 Like

Hi Mick,
Thanks so much for your report!

Unfortunately, I cannot reproduce the issue (see screenshots below).

If you add only one parameter to the field (Layout » MISC » Overflow), the value applies to both axes. If you add two parameters like “hidden visible”, it applies to the x and the y axis independently:

image

Best regards,
timmse

Builder:

Frontend:
image

Hey Stefan,

Appreciate the reply - It does not seem to work for me. Please see the loom vid below:

Many thanks

Mick

Hey Mick,
It looks like the issue can be solved by using the relatively new property “overflow: clip”:

So instead of using overflow: hidden visible, use clip visible, which should do the trick.

Best regards,
timmse

1 Like

Haha, Oooh sounds like some nice CSS porn on a Saturday night!

Nice one Stefan, I will dim the lights and give it a good read :stuck_out_tongue_winking_eye:

Too much information :see_no_evil: :hear_no_evil:

1 Like

Huh, what? I didnt go hard rated and mention container queries did I? :rofl: :rofl:

But this worked a real treat Stefan thank you for the heads up about it!

p.s for others who find themselves with the same question, in the article it also mentions than you are unable to combine a visible with hidden:

#nobug

1 Like

About the container queries: 65% support is round about 30% too little :wink: