[Bug]: Click on select component scrolls to the left of the page

[mkempf]

Bug description

• Two select components are located along side of each other with having a viewport that is smaller than to show both selects (horizontal scrollbar)
• Both select component have selected an option

When try to select an option in the second component the view is scrolled to the left.

Expected behavior

There should be no scrolling and in the second select component an option could be chosen

Steps to reproduce

1. Go to: https://codepen.io/martin_kf/pen/JoojYqQ
2. Select "Thomas Edison" in the left select box
3. Select any other option in the right select box
4. Shrink the UI that you have a scrollbar horizontally to move the right select component
5. Try selecting anything in right select component
6. The browser view port scrolled to the left.

Repeat with the CSS fix in the CSS Section:
-> 6. No scrolling is done an it looks good -> Question: Does it break any other functionality.

Additional context

Tested on:

• OS: Windows
• Browser chrome,
• Device: Desktop