rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-04 16:24:22 +01:00
Code Issues Actions Packages Releases Activity
490c77fad4
Bootstrap/browser-bugs/index.html
Chris Rebert 490c77fad4 Regenerate Wall of Browser Bugs
2016-07-17 14:20:05 -07:00

1 line
27 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html> <html lang=en> <head> <meta charset=utf-8> <meta http-equiv=X-UA-Compatible content="IE=edge"> <meta name=viewport content="width=device-width,initial-scale=1"> <meta name=description content="Bootstrap, a sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development."> <meta name=author content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> <title> Wall of browser bugs &middot; Bootstrap </title> <link href=../dist/css/bootstrap.min.css rel=stylesheet> <link href=../assets/css/docs.min.css rel=stylesheet><!--[if lt IE 9]><script src=../assets/js/ie8-responsive-file-warning.js></script><![endif]--> <script src=../assets/js/ie-emulation-modes-warning.js></script><!--[if lt IE 9]><script src=https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js></script> <script src=https://oss.maxcdn.com/respond/1.4.2/respond.min.js></script><![endif]--> <link rel=apple-touch-icon href=/apple-touch-icon.png> <link rel=icon href=/favicon.ico> <script>!function(e,t,a,n,c,o,s){e.GoogleAnalyticsObject=c,e[c]=e[c]||function(){(e[c].q=e[c].q||[]).push(arguments)},e[c].l=1*new Date,o=t.createElement(a),s=t.getElementsByTagName(a)[0],o.async=1,o.src=n,s.parentNode.insertBefore(o,s)}(window,document,"script","//www.google-analytics.com/analytics.js","ga"),ga("create","UA-146052-10","getbootstrap.com"),ga("send","pageview")</script> </head> <body> <a id=skippy class="sr-only sr-only-focusable" href=#content><div class=container><span class=skiplink-text>Skip to main content</span></div></a> <a href=http://blog.getbootstrap.com/2015/12/08/bootstrap-4-alpha-2/ class=v4-tease>Aww yeah, Bootstrap 4 is coming!</a> <header class="navbar navbar-static-top bs-docs-nav" id=top> <div class=container> <div class=navbar-header> <button class="navbar-toggle collapsed" type=button data-toggle=collapse data-target=#bs-navbar aria-controls=bs-navbar aria-expanded=false> <span class=sr-only>Toggle navigation</span> <span class=icon-bar></span> <span class=icon-bar></span> <span class=icon-bar></span> </button> <a href=../ class=navbar-brand>Bootstrap</a> </div> <nav id=bs-navbar class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li> <a href=../getting-started/ >Getting started</a> </li> <li> <a href=../css/ >CSS</a> </li> <li> <a href=../components/ >Components</a> </li> <li> <a href=../javascript/ >JavaScript</a> </li> <li> <a href=../customize/ >Customize</a> </li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href=http://themes.getbootstrap.com onclick='ga("send","event","Navbar","Community links","Themes")'>Themes</a></li> <li><a href=http://expo.getbootstrap.com onclick='ga("send","event","Navbar","Community links","Expo")'>Expo</a></li> <li><a href=http://blog.getbootstrap.com onclick='ga("send","event","Navbar","Community links","Blog")'>Blog</a></li> </ul> </nav> </div> </header> <div class=bs-docs-header id=content tabindex=-1> <div class=container> <h1>Wall of browser bugs</h1> <p>A list of the browser bugs that Bootstrap is currently grappling with.</p> <div id=carbonads-container><div class=carbonad><div id=azcarbon></div><script>var z=document.createElement("script");z.async=!0,z.src="http://engine.carbonads.com/z/32341/azcarbon_2_1_0_HORIZ";var s=document.getElementsByTagName("script")[0];s.parentNode.insertBefore(z,s)</script></div></div> </div> </div> <div class="container bs-docs-container"> <div class=row> <div class=col-md-12 role=main> <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> <p>See also:</p> <ul> <li><a href="https://code.google.com/p/chromium/issues/detail?id=536263">Chromium issue 536263: [meta] Issues affecting Bootstrap</a></li> <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1230801">Mozilla bug 1230801: Fix the issues that affect Bootstrap</a></li> <li><a href="https://bugs.webkit.org/show_bug.cgi?id=159753">WebKit bug 159753: [meta] Issues affecting Bootstrap</a></li> <li><a href=https://docs.google.com/document/d/1LPaPA30bLUB_publLIMF0RlhdnPx_ePXm7oW02iiT6o>jQuery's browser bug workarounds</a></li> </ul> <div class=table-responsive> <table class="bs-docs-browser-bugs 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>Microsoft Edge </td> <td><p>Native browser tooltip for <code class=highlighter-rouge>title</code> shows on first keyboard focus (in addition to custom tooltip component)</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/6793560>Edge issue #6793560</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18692>#18692</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p>Hovered element still remains in <code class=highlighter-rouge>:hover</code> state after scrolling away.</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/5381673>Edge issue #5381673</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14211>#14211</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p>When hovering over a <code class=highlighter-rouge>&lt;select&gt;</code> menu item, the cursor for the element underneath the menu is displayed.</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/817822>Edge issue #817822</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14528>#14528</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p>CSS <code class=highlighter-rouge>border-radius</code> sometimes causes lines of bleed-through of the <code class=highlighter-rouge>background-color</code> of the parent element.</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3342037>Edge issue #3342037</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/16671>#16671</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p><code class=highlighter-rouge>background</code> of <code class=highlighter-rouge>&lt;tr&gt;</code> is only applied to first child cell instead of all cells in the row</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/5865620>Edge issue #5865620</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18504>#18504</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p><code class=highlighter-rouge>@-ms-viewport{width: device-width;}</code> has side-effect of making scrollbars auto-hide</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7165383>Edge issue #7165383</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18543>#18543</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p>Background color from lower layer bleeds through transparent border in some cases</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/6274505>Edge issue #6274505</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18228>#18228</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p>Hovering over descendant SVG element fires <code class=highlighter-rouge>mouseleave</code> event at ancestor</p> </td> <td><a href=https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7787318>Edge issue #7787318</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19670>#19670</a> </td> </tr> <tr> <td>Firefox </td> <td><p><code class=highlighter-rouge>.table-bordered</code> with an empty <code class=highlighter-rouge>&lt;tbody&gt;</code> is missing borders.</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1023761">Mozilla bug #1023761</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/13453>#13453</a> </td> </tr> <tr> <td>Firefox </td> <td><p>If the disabled state of a form control is changed via JavaScript, the normal state doesn’t return after refreshing the page.</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=654072">Mozilla bug #654072</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/793>#793</a> </td> </tr> <tr> <td>Firefox </td> <td><p><code class=highlighter-rouge>focus</code> events should not be fired at the <code class=highlighter-rouge>document</code> object</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1228802">Mozilla bug #1228802</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18365>#18365</a> </td> </tr> <tr> <td>Firefox </td> <td><p>Wide floated table doesn’t wrap onto new line</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1277782">Mozilla bug #1277782</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19839>#19839</a> </td> </tr> <tr> <td>Firefox </td> <td><p>Mouse sometimes not within element for purposes of <code class=highlighter-rouge>mouseenter</code>/<code class=highlighter-rouge>mouseleave</code> when it’s within SVG elements</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=577785">Mozilla bug #577785</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19670>#19670</a> </td> </tr> <tr> <td>Firefox </td> <td><p><code class=highlighter-rouge>position: absolute</code> element that’s wider than its column renders differently than other browsers</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1282363">Mozilla bug #1282363</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/20161>#20161</a> </td> </tr> <tr> <td>Firefox (Windows) </td> <td><p>Right border of <code class=highlighter-rouge>&lt;select&gt;</code> menu is sometimes missing when screen is set to uncommon resolution</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=545685">Mozilla bug #545685</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/15990>#15990</a> </td> </tr> <tr> <td>Firefox (OS X & Linux) </td> <td><p>Badge widget causes bottom border of Tabs widget to unexpectedly not overlap</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1259972">Mozilla bug #1259972</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19626>#19626</a> </td> </tr> <tr> <td>Chrome (Android) </td> <td><p>Tapping on an <code class=highlighter-rouge>&lt;input&gt;</code> in a scrollable overlay doesn’t scroll the <code class=highlighter-rouge>&lt;input&gt;</code> into view</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=595210">Chromium issue #595210</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17338>#17338</a> </td> </tr> <tr> <td>Chrome (OS X) </td> <td><p>Clicking above <code class=highlighter-rouge>&lt;input type="number"&gt;</code> increment button flashes the decrement button.</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=419108">Chromium issue #419108</a> </td> <td>Offshoot of <a href=https://github.com/twbs/bootstrap/issues/8350>#8350</a> & <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=337668">Chromium issue #337668</a> </td> </tr> <tr> <td>Chrome </td> <td><p>CSS infinite linear animation with alpha transparency leaks memory.</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=429375">Chromium issue #429375</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14409>#14409</a> </td> </tr> <tr> <td>Chrome </td> <td><p><code class=highlighter-rouge>:focus</code> <code class=highlighter-rouge>outline</code> style causes cursor to not be displayed when toggling a <code class=highlighter-rouge>readonly</code> <code class=highlighter-rouge>&lt;input&gt;</code> to read-write.</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=465274">Chromium issue #465274</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/16022>#16022</a> </td> </tr> <tr> <td>Chrome </td> <td><p><code class=highlighter-rouge>table-cell</code> borders not overlapping despite <code class=highlighter-rouge>margin-right: -1px</code></p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=534750">Chromium issue #534750</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17438>#17438</a>, <a href=https://github.com/twbs/bootstrap/issues/14237>#14237</a> </td> </tr> <tr> <td>Chrome </td> <td><p>Clicking scrollbar in <code class=highlighter-rouge>&lt;select multiple&gt;</code> with overflowed options will select nearby <code class=highlighter-rouge>&lt;option&gt;</code></p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=597642">Chromium issue #597642</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19810>#19810</a> </td> </tr> <tr> <td>Chrome </td> <td><p>Don’t make <code class=highlighter-rouge>:hover</code> sticky on touch-friendly webpages</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=370155">Chromium issue #370155</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/12832>#12832</a> </td> </tr> <tr> <td>Chrome (Windows & Linux) </td> <td><p>Animation glitch when returning to inactive tab after animations occurred while tab was hidden.</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=449180">Chromium issue #449180</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/15298>#15298</a> </td> </tr> <tr> <td>Safari </td> <td><p><code class=highlighter-rouge>rem</code> units in media queries should be calculated using <code class=highlighter-rouge>font-size: initial</code>, not the root element’s <code class=highlighter-rouge>font-size</code></p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=156684">WebKit bug #156684</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17403>#17403</a> </td> </tr> <tr> <td>Safari (OS X) </td> <td><p><code class=highlighter-rouge>px</code>, <code class=highlighter-rouge>em</code>, and <code class=highlighter-rouge>rem</code> should all behave the same in media queries when page zoom is applied</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=156687">WebKit bug #156687</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17403>#17403</a> </td> </tr> <tr> <td>Safari (OS X) </td> <td><p>Weird button behavior with some <code class=highlighter-rouge>&lt;input type="number"&gt;</code> elements.</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=137269">WebKit bug #137269</a>, <a href=https://openradar.appspot.com/18834768>Apple Safari Radar #18834768</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>, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=337668">Chromium issue #337668</a> </td> </tr> <tr> <td>Safari (OS X) </td> <td><p>Small font size when printing webpage with fixed-width <code class=highlighter-rouge>.container</code>.</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=138192">WebKit bug #138192</a>, <a href=https://openradar.appspot.com/19435018>Apple Safari Radar #19435018</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14868>#14868</a> </td> </tr> <tr> <td>Safari (iPad) </td> <td><p><code class=highlighter-rouge>&lt;select&gt;</code> menu on iPad causes shifting of hit-testing areas</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=150079">WebKit bug #150079</a>, <a href=https://openradar.appspot.com/23082521>Apple Safari Radar #23082521</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14975>#14975</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p><code class=highlighter-rouge>transform: translate3d(0,0,0);</code> rendering bug.</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=138162">WebKit bug #138162</a>, <a href=https://openradar.appspot.com/18804973>Apple Safari Radar #18804973</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14603>#14603</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Text input’s cursor doesn’t move while scrolling the page.</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=138201">WebKit bug #138201</a>, <a href=https://openradar.appspot.com/18819624>Apple Safari Radar #18819624</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14708>#14708</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Can’t move cursor to start of text after entering long string of text into <code class=highlighter-rouge>&lt;input type="text"&gt;</code></p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=148061">WebKit bug #148061</a>, <a href=https://openradar.appspot.com/22299624>Apple Safari Radar #22299624</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/16988>#16988</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p><code class=highlighter-rouge>display: block</code> causes text of temporal <code class=highlighter-rouge>&lt;input&gt;</code>s to become vertically misaligned</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=139848">WebKit bug #139848</a>, <a href=https://openradar.appspot.com/19434878>Apple Safari Radar #19434878</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/11266>#11266</a>, <a href=https://github.com/twbs/bootstrap/issues/13098>#13098</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Tapping on <code class=highlighter-rouge>&lt;body&gt;</code> doesn’t fire <code class=highlighter-rouge>click</code> events</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=151933">WebKit bug #151933</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/16028>#16028</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p><code class=highlighter-rouge>position:fixed</code> is incorrectly positioned when tab bar is visible on iPhone 6S+ Safari</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=153056">WebKit bug #153056</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18859>#18859</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Tapping into an <code class=highlighter-rouge>&lt;input&gt;</code> within a <code class=highlighter-rouge>position:fixed</code> element scrolls to the top of the page</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=153224">WebKit bug #153224</a>, <a href=https://openradar.appspot.com/24235301>Apple Safari Radar #24235301</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17497>#17497</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p><code class=highlighter-rouge>&lt;body&gt;</code> with <code class=highlighter-rouge>overflow:hidden</code> CSS is scrollable on iOS</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=153852">WebKit bug #153852</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14839>#14839</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Scroll gesture in text field in <code class=highlighter-rouge>position:fixed</code> element sometimes scrolls <code class=highlighter-rouge>&lt;body&gt;</code> instead of scrollable ancestor</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=153856">WebKit bug #153856</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/14839>#14839</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Tapping from one <code class=highlighter-rouge>&lt;input&gt;</code> to another in an overlay can cause shaking/jiggling effect</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=158276">WebKit bug #158276</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19927>#19927</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Modal with <code class=highlighter-rouge>-webkit-overflow-scrolling: touch</code> doesn’t become scrollable after added text makes it taller</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=158342">WebKit bug #158342</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17695>#17695</a> </td> </tr> <tr> <td>Safari (iOS) </td> <td><p>Don’t make <code class=highlighter-rouge>:hover</code> sticky on touch-friendly webpages</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=158517">WebKit bug #158517</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/12832>#12832</a> </td> </tr> <tr> <td>Safari (iPad Pro) </td> <td><p>Rendering of descendants of <code class=highlighter-rouge>position: fixed</code> element gets clipped on iPad Pro in Landscape orientation</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=152637">WebKit bug #152637</a>, <a href=https://openradar.appspot.com/24030853>Apple Safari Radar #24030853</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/18738>#18738</a> </td> </tr> </tbody> </table> </div> </div> <div class=bs-docs-section> <h1 id=most-wanted class=page-header>Most wanted features</h1> <p class=lead>There are several features specified in Web standards which would allow us to make Bootstrap more robust, elegant, or performant, but aren't yet implemented in certain browsers, thus preventing us from taking advantage of them.</p> <p>We publicly list these "most wanted" feature requests here, in the hopes of expediting the process of getting them implemented.</p> <div class=table-responsive> <table class="bs-docs-browser-bugs table table-bordered table-hover"> <thead> <tr> <th>Browser(s)</th> <th>Summary of feature</th> <th>Upstream issue(s)</th> <th>Bootstrap issue(s)</th> </tr> </thead> <tbody> <tr> <td>Microsoft Edge </td> <td><p>Implement the <a href=https://developer.mozilla.org/en-US/docs/Web/CSS/:dir><code class=highlighter-rouge>:dir()</code> pseudo-class</a> from Selectors Level 4</p> </td> <td><a href=https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/12299532>Edge UserVoice idea #12299532</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19984>#19984</a> </td> </tr> <tr> <td>Microsoft Edge </td> <td><p>Implement <a href=http://html5please.com/#position:sticky>sticky positioning</a> from CSS Positioned Layout Level 3</p> </td> <td><a href=https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6263621>Edge UserVoice idea #6263621</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17021>#17021</a> </td> </tr> <tr> <td>Firefox </td> <td><p>Fire a <a href=https://developer.mozilla.org/en-US/docs/Web/Events/transitioncancel><code class=highlighter-rouge>transitioncancel</code> event</a> when a CSS transition is canceled</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1264125">Mozilla bug #1264125</a> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1182856">Mozilla bug #1182856</a> </td> </tr> <tr> <td>Firefox </td> <td><p>Implement the <a href="http://caniuse.com/#feat=css-nth-child-of"><code class=highlighter-rouge>of &lt;selector-list&gt;</code> clause</a> of the <code class=highlighter-rouge>:nth-child()</code> pseudo-class</p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=854148">Mozilla bug #854148</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/20143>#20143</a> </td> </tr> <tr> <td>Firefox </td> <td><p>Implement the HTML5 <a href=https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog><code class=highlighter-rouge>&lt;dialog&gt;</code> element</a></p> </td> <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=840640">Mozilla bug #840640</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/20175>#20175</a> </td> </tr> <tr> <td>Chrome </td> <td><p>Implement the <a href="http://caniuse.com/#feat=css-nth-child-of"><code class=highlighter-rouge>of &lt;selector-list&gt;</code> clause</a> of the <code class=highlighter-rouge>:nth-child()</code> pseudo-class</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=304163">Chromium issue #304163</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/20143>#20143</a> </td> </tr> <tr> <td>Chrome </td> <td><p>Implement the <a href=https://developer.mozilla.org/en-US/docs/Web/CSS/:dir><code class=highlighter-rouge>:dir()</code> pseudo-class</a> from Selectors Level 4</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=576815">Chromium issue #576815</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19984>#19984</a> </td> </tr> <tr> <td>Chrome </td> <td><p>Implement <a href=http://html5please.com/#position:sticky>sticky positioning</a> from CSS Positioned Layout Level 3</p> </td> <td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=231752">Chromium issue #231752</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/17021>#17021</a> </td> </tr> <tr> <td>Safari </td> <td><p>Implement the <a href=https://developer.mozilla.org/en-US/docs/Web/CSS/:dir><code class=highlighter-rouge>:dir()</code> pseudo-class</a> from Selectors Level 4</p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=64861">WebKit bug #64861</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/19984>#19984</a> </td> </tr> <tr> <td>Safari </td> <td><p>Implement the HTML5 <a href=https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog><code class=highlighter-rouge>&lt;dialog&gt;</code> element</a></p> </td> <td><a href="https://bugs.webkit.org/show_bug.cgi?id=84635">WebKit bug #84635</a> </td> <td><a href=https://github.com/twbs/bootstrap/issues/20175>#20175</a> </td> </tr> </tbody> </table> </div> </div> </div> </div> </div> <footer class=bs-docs-footer> <div class=container> <ul class=bs-docs-footer-links> <li><a href=https://github.com/twbs/bootstrap>GitHub</a></li> <li><a href=https://twitter.com/getbootstrap>Twitter</a></li> <li><a href=../getting-started/#examples>Examples</a></li> <li><a href=../about/ >About</a></li> </ul> <p>Designed and built with all the love in the world by <a href=https://twitter.com/mdo target=_blank>@mdo</a> and <a href=https://twitter.com/fat target=_blank>@fat</a>. Maintained by the <a href=https://github.com/orgs/twbs/people>core team</a> with the help of <a href=https://github.com/twbs/bootstrap/graphs/contributors>our contributors</a>.</p> <p>Code licensed <a rel=license href=https://github.com/twbs/bootstrap/blob/master/LICENSE target=_blank>MIT</a>, docs <a rel=license href=https://creativecommons.org/licenses/by/3.0/ target=_blank>CC BY 3.0</a>.</p> </div> </footer> <script src=https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js></script> <script>window.jQuery||document.write('<script src="../assets/js/vendor/jquery.min.js"><\/script>')</script> <script src=../dist/js/bootstrap.min.js></script> <script src=../assets/js/docs.min.js></script> <script src=../assets/js/ie10-viewport-bug-workaround.js></script> <script>var _gauges=_gauges||[];!function(){var e=document.createElement("script");e.async=!0,e.id="gauges-tracker",e.setAttribute("data-site-id","4f0dc9fef5a1f55508000013"),e.src="//secure.gaug.es/track.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)}()</script>
Reference in New Issue View Git Blame Copy Permalink