title: Resizing a select multiple list with the size of the dialog box
body: <p>I have a select list inside a dialog box:</p>
  
  <pre><code>&lt;div id='Dialog' title='Title'&gt;
      &lt;div id='list_container'&gt;
          &lt;select id='file_list' multiple='multiple'&gt;
          &lt;/select&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'm populating <code>file_list</code> in javascript. The css for <code>list_container</code> and 'file_list` look like this:</p>
  
  <pre><code>#list_container {
      width: auto;
      height: auto;
      overflow: auto;
      border: 1px black solid;
      margin: auto;
  }
  
  #file_list {
      border: none;
  }
  </code></pre>
  
  <p>The <code>file_list</code> opens inside a dialog box and typically has many options(>20). When the dialog box pops up, the list shows about 10 entries and I can scroll down to other entries. However, I want the list to expand vertically when I resize the dialog box vertically (i.e. the list should show more than 10 entries depending on the vertical space available in the dialog box). How can I do this? I tried doing a few things like setting the height css attribute for <code>file_list</code> to auto , but it doesn't seem to work.</p>