title: how to make a ul 's elements go outside a div with overflow set to hidden
body: <p>I have a div with some content in it which includes a ul with a list of names the div tag has overflow set to hidden  and height :auto so that it increases in height with the content .However i have a ul with a list of names and i want the list to go outside the box . something like the facebook add people autocomplete . The people list shows outside the box</p>
  
  <p>heres my syntax</p>
  
  <pre><code>   &lt;div&gt;
  
      &lt;!-- content goes here --&gt;
  
      &lt;ul&gt;&lt;!-- names go here --&gt; &lt;/ul&gt;
  
  
      &lt;/div&gt;
  </code></pre>
  
  <p>updated</p>
  
  <pre><code>&lt;div&gt;&lt;!-- div with overflow set to hidden--&gt;
  
  &lt;ul class="selected"&gt;&lt;/ul&gt;&lt;!-- ul containing selected elements--&gt;
  
  &lt;ul class="users"&gt;&lt;/ul&gt; &lt;!-- list of users --&gt;
  
  
  &lt;/div&gt;
  
  div{overflow:hidden}
  
  .selected{overflow:hidden}
  
  .users{position:absolute}
  </code></pre>
  
  <p>I need the users div to go outside the box but because the parent div is set to overflow hidden it gets cut off. I cannot remove the overflow hidden because as the div with class selected gets more elements the parent div wont expand</p>