title: Bootstrap dropdown clipped by overflow:hidden container, how to change the container?
body: <p>Using bootstrap, I have a dropdown menu(<strong>s</strong>) inside a <code>div</code> with <code>overflow:hidden</code>, which is needed to be like this. This caused the dropdowns to be clipped by the container.</p>
  
  <p>My question, how can I solve this clipping issue, e.g. change the container of all dropdowns inside my project to be <code>body</code>, with lowest cost possible?</p>
  
  <p>this is an example of the code:
  <a href="http://jsfiddle.net/0y3rk8xz/">http://jsfiddle.net/0y3rk8xz/</a></p>