Width of select element using dropdown menu increases if label text is too wide

[Steve-OH]

The big picture of what I'm trying to do

I'm trying to use the select element with a dropdown menu.

What I did

A working example is here: https://ellie-app.com/mPfZVKXCDa1/1

To see the problem, select the longer text (Tripe...) from the dropdown menu.

(Note that this example also exhibits the problem described in #108, but that's not what this one is about.)

What I Expected To Happen

After the selection is made, the element should display the selection's label, but otherwise return to its previous appearance.

What Actually Happened

If the text label for one of the submenu items attached to a select field is too wide, the field increases in width to accommodate the width of the text. Strangely enough, the text in the menu itself is elided to match the width of the field. If anything, it should be the other way around: show the full text when displaying the menu, then elide it as necessary when the menu goes away and you're just displaying it in the select itself.

Versions

• Elm: 0.18
• style-elements: 4.3.0
• Browser: Chrome 64.0.3282.186, Firefox 58.0.2, Edge 41.16299.248.0
• Operating System: Windows 10 1709/16299.248, macOS 10.13.2