exploring <select> being too wide, simplified

broken fieldset version alone

HTML

<div class="min">
    <fieldset>
      <div class="wrapper">
            <select id="section" name="section">
                <option></option>
                <option selected="selected">The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</option>
                <option>the</option>              
                <option>quick</option>
                <option>brown</option>
                <option>fox</option>
            </select>
      </div>
    </fieldset>
  </div>

CSS

/* -- Squish box (box is narrower than content) -- */
.min {
  width: 200px; 
  background: #ccc;
  height: 100px;
}
/* -- general page setup -- */
fieldset {
    margin: 0;
    padding: 0;
    border: none;
    background: #f00;
    height: 50px;  
}
select {
    max-width: 90%;
}

/* -- Mozilla fix -- */
@-moz-document url-prefix() {
    fieldset {
        display: table-cell;
    }
}

/* -- iOS/webkit fix -- */ 
fieldset {
    min-width: 0; /* supposedly only this line is required - seems ineffective however (see below) */
    width: 20%; /* -- without this line iOS safari will cause havok --*/
}