Bootstrap/docs/browser-bugs.html

---
layout: default
title: Wall of browser bugs
slug: browser-bugs
lead: "A list of the browser bugs that Bootstrap is currently grappling with."
---


<div class="bs-docs-section">
  <h1 id="browser-bugs" class="page-header">Browser bugs</h1>

  <p class="lead">Bootstrap currently works around several outstanding browser bugs in major browsers to deliver the best cross-browser experience possible. Some bugs, like those listed below, cannot be solved by us.</p>
  <p>We publicly list browser bugs that are impacting us here, in the hopes of expediting the process of fixing them. For information on Bootstrap's browser compatibility, <a href="../getting-started/#support">see our browser compatibility docs</a>.</p>

  <div class="table-responsive">
    <table class="table table-bordered table-hover">
      <thead>
        <tr>
          <th>Browser(s)</th>
          <th>Summary of bug</th>
          <th>Upstream bug(s)</th>
          <th>Bootstrap issue(s)</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>Firefox &lt;30</td>
          <td>Allow use of line-height for <code>&lt;input&gt;</code>-based buttons</td>
          <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=697451">Mozilla bug #697451</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/2985">#2985</a></td>
        </tr>
        <tr>
          <td>Firefox</td>
          <td>Unusual default form control styles on Android</td>
          <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=900871">Closed Mozilla bug #900871</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=763671">Open Mozilla bug #763671</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/8702">#8702</a></td>
        </tr>
        <tr>
          <td>Firefox</td>
          <td><code>max-width: 100%;</code> doesn't work inside tables</td>
          <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=975632">Mozilla bug #975632</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/10690">#10690</a></td>
        </tr>
        <tr>
          <td>Firefox <strong>&le;27</strong></td>
          <td><code>position: relative;</code> doesn't work inside tables</td>
          <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=63895">Mozilla bug #63895</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/12467">#12467</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td>Weird button behavior with some number inputs</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=337668">Chromium issue #337668</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/8350">#8350</a>, <a href="https://github.com/necolas/normalize.css/issues/283">Normalize #283</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td>Navbar rendering problem on Windows after several clicks</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=272750">Chromium issue #272750</a>, <a href="https://bugs.webkit.org/show_bug.cgi?id=119793">WebKit bug #119793</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/9226">#9226</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td><code>display: table;</code> within <code>display: block;</code> forces sibling content to new line</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=309483">Chromium issue #309483</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/9950">#9950</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td>Unwanted vertical lines when printing styled <code>&lt;select&gt;s</code> on OS X</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=282918">Chromium issue #282918</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/11245">#11245</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td>inline-block element collapses white-space on Windows</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=329574">Chromium issue #329574</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/11885">#11885</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td>Incorrect viewport size used for media queries when printing</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=273306">Chromium issue #273306</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/12078">#12078</a></td>
        </tr>
        <tr>
          <td>Chrome &amp; Safari</td>
          <td>OS X scrollbar clipped in <code>select[multiple]</code> with padding</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=342208">Chromium issue #342208</a>, <a href="https://bugs.webkit.org/show_bug.cgi?id=128489">WebKit bug #128489</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/12536">#12536</a></td>
        </tr>
        <tr>
          <td>Chrome</td>
          <td><code>display: table-cell; width: 100%;</code> doesn't work correctly on date input</td>
          <td><a href="https://code.google.com/p/chromium/issues/detail?id=346051">Chromium issue #346051</a></td>
          <td><a href="https://github.com/twbs/bootstrap/issues/12548">#12548</a></td>
        </tr>
        <tr>
          <td>Safari</td>
          <td>Insufficient CSS percentage precision</td>
          <td>(No public bug tracker)</td>
          <td><a href="https://github.com/twbs/bootstrap/issues/9282">#9282</a></td>
        </tr>
        <tr>
          <td>Safari</td>
          <td>Justified nav rendering bug</td>
          <td>(No public bug tracker)</td>
          <td><a href="https://github.com/twbs/bootstrap/issues/9774">#9774</a></td>
        </tr>
      </tbody>
    </table>
  </div>

</div>