exploring <select> being too wide, simplified

broken fieldset version alone, with 50%-width wrapper div

by roryokane

HTML

<fieldset>
	<div class="wrapper">
        <select id="section" name="section">
            <option value="-1"></option>
            <option value="1501" selected="selected">Sphinx of black quartz, judge my vow. The quick brown fox jumps over the lazy dog.</option>
            <option value="1480">Subcontractor</option>
            <option value="3181">Valley</option>
            <option value="3180">Ventura</option>
            <option value="3220">Very Newest Section</option>
            <option value="1481">Visitor</option>
            <option value="3200">N/A</option>
        </select>
	</div>
</fieldset>

CSS

fieldset {
    /* hide fieldset-specific visual features: */
    margin: 0;
    padding: 0;
    border: none;
    
    /* try to fix the width, with no success: */
    width: auto;
    min-width: auto;
    max-width: auto;
}

div.wrapper {
    width: 50%;
}

select {
    max-width: 100%;
}