title: How can I build a <select> with multiline options?
body: <p>I need to build a multi-line select control. All the <code>&lt;option&gt;</code>'s where text is wider than 300px (for example) become to have the necessary lines to don't exceed the mentioned limit.</p>
  
  <p>These images speak for themselves:</p>
  
  <p><img src="https://i.stack.imgur.com/yLgBZ.jpg" alt="http://home.comcast.net/~ephmynus/select1.jpg">
  <img src="https://i.stack.imgur.com/nghgE.jpg" alt="http://home.comcast.net/~ephmynus/select2.jpg"></p>
  
  <hr>
  
  <p>First of all I tried this, but does not work.</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;style&gt;
              option{
                  width: 100px; 
                  white-space: wrap;
              }
  
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;select&gt;
              &lt;option&gt;I'm short&lt;/option&gt;
              &lt;option&gt;I'm medium text&lt;/option&gt;
              &lt;option&gt;I'm a very very very very very very very very very long text&lt;/option&gt;
          &lt;/select&gt;   
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I'm using bootstrap framework and I thought that maybe I could use dropdown control to obtain the result. I've tried setting the max-width CSS property, but it does not work too...</p>
  
  <p>How can I achieve this?</p>