title: Bootstrap Input with datalist dropdown doesn´t work on iPhone (6s)
body: <p>I wrote a simple <code>HTML5</code> / <code>Javascript</code> application. 
  I used the <code>bootstrap3</code> (<code>js</code> &amp; <code>css</code>).
  The app itself should be mobile friendly: </p>
  
  <pre><code>&lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  </code></pre>
  
  <p>On mobile devices the look &amp; feel is as designed, except for one issue:
  I am using inputs (inside a <code>.well</code>) with datalists like this:</p>
  
  <pre><code> &lt;div class="form-group"&gt;
                    &lt;label for="userIdType"&gt;Type:&lt;/label&gt;
                    &lt;input type="text" class="form-control" id="userIdType"  list = "lst_userIdTypes" value="AD_ID"&gt; 
                    &lt;datalist id="lst_userIdTypes"&gt;
                      &lt;option&gt;AD_ID&lt;/option&gt;
                      &lt;option&gt;PU_ID&lt;/option&gt;
                      &lt;option&gt;XU_ID&lt;/option&gt;
                      &lt;option&gt;DE_ID&lt;/option&gt;
                      &lt;option&gt;AP_ID&lt;/option&gt;
                    &lt;/datalist&gt;
                  &lt;/div&gt;
  </code></pre>
  
  <p>The list works fine on Android 5.x phones with chrome and firefox browser.</p>
  
  <p>But on my iPhone (6s) in safari and chrome browser the values of the list don´t show.
  Is this a known issue? Does anybody know how to fix that?</p>
  
  <p>Thanks!</p>