title: Overflow of HTML5 <input> tag using datalist in chrome
body: <p>I have a HTML page at <a href="http://codepen.io/liang179/pen/WQvERK" rel="noreferrer">http://codepen.io/liang179/pen/WQvERK</a> contain a  tag associated with a large datalist. It display in chrome has a overflow.There still have data out of screen.but It is fine in firefox with scroll bar.
  What can I do to make it display in chrome with scroll bar like in firefox.
  Below is the code.
  <div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('#trigger').click(function(){
    $class = "animated infinite " + $('#type').val();
    $('#target').removeClass().addClass($class);
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div style="text-align: center;"&gt;
   &lt;div id='target' style="margin: 200px auto; width: 200px; height:200px; background-color:#663399"&gt;&lt;/div&gt;
   &lt;div&gt;
    &lt;input id="type" list="classes"&gt;
    &lt;datalist id="classes"&gt;
     &lt;option value="bounce"&gt;
     &lt;option value="flash"&gt;
     &lt;option value="pulse"&gt;
     &lt;option value="rubberBand"&gt;
     &lt;option value="shake"&gt;
     &lt;option value="swing"&gt;
     &lt;option value="tada"&gt;
     &lt;option value="wobble"&gt;
     &lt;option value="jello"&gt;
     &lt;option value="bounceIn"&gt;
     &lt;option value="bounceInDown"&gt;
     &lt;option value="bounceInLeft"&gt;
     &lt;option value="bounceInRight"&gt;
     &lt;option value="bounceInUp"&gt;
     &lt;option value="bounceOut"&gt;
     &lt;option value="bounceOutDown"&gt;
     &lt;option value="bounceOutLeft"&gt;
     &lt;option value="bounceOutRight"&gt;
     &lt;option value="bounceOutUp"&gt;
     &lt;option value="fadeIn"&gt;
     &lt;option value="fadeInDown"&gt;
     &lt;option value="fadeInDownBig"&gt;
     &lt;option value="fadeInLeft"&gt;
     &lt;option value="fadeInLeftBig"&gt;
     &lt;option value="fadeInRight"&gt;
     &lt;option value="fadeInRightBig"&gt;
     &lt;option value="fadeInUp"&gt;
     &lt;option value="fadeInUpBig"&gt;
     &lt;option value="fadeOut"&gt;
     &lt;option value="fadeOutDown"&gt;
     &lt;option value="fadeOutDownBig"&gt;
     &lt;option value="fadeOutLeft"&gt;
     &lt;option value="fadeOutLeftBig"&gt;
     &lt;option value="fadeOutRight"&gt;
     &lt;option value="fadeOutRightBig"&gt;
     &lt;option value="fadeOutUp"&gt;
     &lt;option value="fadeOutUpBig"&gt;
     &lt;option value="flipInX"&gt;
     &lt;option value="flipInY"&gt;
     &lt;option value="flipOutX"&gt;
     &lt;option value="flipOutY"&gt;
     &lt;option value="lightSpeedIn"&gt;
     &lt;option value="lightSpeedOut"&gt;
     &lt;option value="rotateIn"&gt;
     &lt;option value="rotateInDownLeft"&gt;
     &lt;option value="rotateInDownRight"&gt;
     &lt;option value="rotateInUpLeft"&gt;
     &lt;option value="rotateInUpRight"&gt;
     &lt;option value="rotateOut"&gt;
     &lt;option value="rotateOutDownLeft"&gt;
     &lt;option value="rotateOutDownRight"&gt;
     &lt;option value="rotateOutUpLeft"&gt;
     &lt;option value="rotateOutUpRight"&gt;
     &lt;option value="hinge"&gt;
     &lt;option value="rollIn"&gt;
     &lt;option value="rollOut"&gt;
     &lt;option value="zoomIn"&gt;
     &lt;option value="zoomInDown"&gt;
     &lt;option value="zoomInLeft"&gt;
     &lt;option value="zoomInRight"&gt;
     &lt;option value="zoomInUp"&gt;
     &lt;option value="zoomOut"&gt;
     &lt;option value="zoomOutDown"&gt;
     &lt;option value="zoomOutLeft"&gt;
     &lt;option value="zoomOutRight"&gt;
     &lt;option value="zoomOutUp"&gt;
     &lt;option value="slideInDown"&gt;
     &lt;option value="slideInLeft"&gt;
     &lt;option value="slideInRight"&gt;
     &lt;option value="slideInUp"&gt;
     &lt;option value="slideOutDown"&gt;
     &lt;option value="slideOutLeft"&gt;
     &lt;option value="slideOutRight"&gt;
     &lt;option value="slideOutUp"&gt;
    &lt;/datalist&gt;
    &lt;button id="trigger"&gt;Trigger&lt;/button&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  &lt;script src="//cdn.bootcss.com/jquery/2.1.4/jquery.min.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>