Inconsistent width for select with/without multiple attribute in Chrome

• Component: CSS
• Status: RESOLVED INVALID

I'm not totally sure what the correct behaviour should be (and whether I am right here, since this happens only in Chrome but not in Safari), but here is my observation with Chrome 39.0.2138.3 on OSX 10.10 DP6:

When having this html:

<div id="container">
    <div class="select_container">
        <select multiple>
            <option>Very long option Very long option Very long option Very long option Very long option</option>
        </select>
    </div>
    <div class="select_container">
        <select multiple>
            <option>Not so long</option>
        </select>
    </div>
</div>

with this style:

#container {
    width: 200px;
    display: table;
}
.select_container {
    width: 50%;
    display: table-cell;
}
select {
    width: 100%;
}

I'd expect the `.select_container` and `select` to be 100px wide (50% of the 200px of their parent). But the space they take is dependent on the text in the `option` tag.

When you remove the `multiple`, the `select` and `.select_container` have a width of 100px like expected. See http://jsfiddle.net/ces2L3Ln/3/

In Firefox (33.0a2) the width is always 100px, not dependent on `multiple`.

Safari Version 8.0 (10600.1.8) (Yosemite DP6) renders the width like Firefox (100px), too.

Other browser/versions untested.

I'd expect it to behave like Firefox/Safari do it (`multiple` should not change the width calculation of the `select` tag). Or are they doing it wrong? Is there any hint in the spec?

[Alexey Proskuryakov]

Thank you for the report!

I cannot reproduce this issue with a current WebKit nightly build.

Chrome has a forked version of WebKit now, so can we no longer track its bugs in WebKit Bugzilla. Please report the issue directly to Google.