Change Overflow to Clip

[Lucien950]

Consider the following situation

Suppose that there is a swiping element horizontally with a few elements, which grown when hovered. When it grows, it exeeds the Y axis overflow.
With overflow hidden, setting overflow-y to "visible" does nothing. However setting overflow to clip allows y-overflow to be visible.
This is as per the W3 Specification:

The visible/clip values of overflow compute to auto/hidden (respectively) if one of overflow-x or overflow-y is neither visible nor clip.

[Lucien950]

There might be a few more instances where this can be changed, but these are the only ones that I found.

[Lucien950]

I am also not 100% on all the side effects of this change, so that might be good to double check

[nolimits4web]

Would like to see a live example (better codesandbox) where it is used with Swiper

[Lucien950]

Would like to see a live example (better codesandbox) where it is used with Swiper

I got you: CodePen

[nolimits4web]

@Lucien950 thank you. I will merge a bit later as it can be a breaking change, so this will land into upcoming v10

[zarko-tg]

What if one needs overflow-y visible on the ".swiper" now? How to override?

[nolimits4web]

What if one needs overflow-y visible on the ".swiper" now? How to override?

Using CSS

[zarko-tg]

What if one needs overflow-y visible on the ".swiper" now? How to override?

Using CSS

Ah, just saw it's with part="container", I'll try, thanks.

[mateuswetah]

Hi @Lucien950! I was migrating a project from Swiper 8 to 10 and faced some issues regarding this change. I tried my best to reproduce it here:
https://codesandbox.io/s/agitated-moon-tjg9tt?fontsize=14&hidenavigation=1&theme=dark

When the overflow was hidden, both Swiper and the "something" content could expand as they needed in this layout. Now, due to the clip, the Swiper ends up growing more than it should. Would you have any suggestion on how could I achieve the same layout without forcing it to be hidden again?

Appreciate your support, if available :)

[Lucien950]

I am not sure I understand the issue. They seem to be both expanding the same amount.

[mateuswetah]

I am not sure I understand the issue. They seem to be both expanding the same amount.

@Lucien950 that is weird... maybe browser or window size? I'm seeing this in my Firefox:

[Lucien950]

I am not sure I understand the issue. They seem to be both expanding the same amount.

@Lucien950 that is weird... maybe browser or window size? I'm seeing this in my Firefox:

I too see it on firefox. It is also strange that the arrows are not there. Perhaps these two problems are related?

[mateuswetah]

Yeah, definitely browser-related, it works on Chrome. The arrow does not appear because Swiper seems to believe it has enough space.