iOS 7-10 Safari: Long select options with flexbox parent overflow the page

[slavanga]

Summary:

Select options behave differently if the select element is a flex item. Long text in options will make the page overflow for no reason.

Platforms:

iOS Safari 7 - 10

How to reproduce:

1. Load the example
2. Swipe to the right

Reduced Example:

https://jsfiddle.net/zj1n06fp/6/

Workarounds:

Add overflow-x: hidden on the select element.

[nicbou]

I can't believe that the fix what this easy. Thank you for taking the time to write this issue. I can confirm that it still works as of July 14, 2022.