Document sticky :hover on mobile browsers; fixes #12832

diff --git a/docs/_includes/getting-started/browser-device-support.html b/docs/_includes/getting-started/browser-device-support.html
index b5a2d892d281d6aa0c99143b0a68a8ea3a47489b..b27099aa60f5a52b4b3c735d0fd24ea3cfda128a 100644 (file)
--- a/docs/_includes/getting-started/browser-device-support.html
+++ b/docs/_includes/getting-started/browser-device-support.html
@@ -164,6 +164,9 @@ if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
   <h3 id="support-browser-zooming">Browser zooming</h3>
   <p>Page zooming inevitably presents rendering artifacts in some components, both in Bootstrap and the rest of the web. Depending on the issue, we may be able to fix it (search first and then open an issue if need be). However, we tend to ignore these as they often have no direct solution other than hacky workarounds.</p>
 
+  <h3 id="support-sticky-hover-mobile">Sticky <code>:hover</code>/<code>:focus</code> on mobile</h3>
+  <p>Even though real hovering isn't possible on most touchscreens, most mobile browsers emulate hovering support and make <code>:hover</code> "sticky". In other words, <code>:hover</code> styles start applying after tapping an element and only stop applying after the user taps some other element. This can cause Bootstrap's <code>:hover</code> states to become unwantedly "stuck" on such browsers. Some mobile browsers also make <code>:focus</code> similarly sticky. There is currently no simple workaround for these issues other than removing such styles entirely.</p>
+
   <h3 id="support-printing">Printing</h3>
   <p>Even in some modern browsers, printing can be quirky.</p>
   <p>In particular, as of Chrome v32 and regardless of margin settings, Chrome uses a viewport width significantly narrower than the physical paper size when resolving media queries while printing a webpage. This can result in Bootstrap's extra-small grid being unexpectedly activated when printing. <a href="https://github.com/twbs/bootstrap/issues/12078">See #12078 for some details.</a> Suggested workarounds:</p>

diff --git a/docs/_includes/nav/getting-started.html b/docs/_includes/nav/getting-started.html
index b06dcce9b2ab0cdf747a5ff6f80ba5e6a5bafa32..4a07fe79c773ade9cde0ccc45ccc53b9c90b3d5e 100644 (file)
--- a/docs/_includes/nav/getting-started.html
+++ b/docs/_includes/nav/getting-started.html
@@ -56,6 +56,7 @@
     <li><a href="#support-safari-percentages">Safari percent rounding</a></li>
     <li><a href="#support-fixed-position-keyboards">Modals, navbars, and virtual keyboards</a></li>
     <li><a href="#support-browser-zooming">Browser zooming</a></li>
+    <li><a href="#support-sticky-hover-mobile">Sticky :hover/:focus on mobile</a></li>
     <li><a href="#support-printing">Printing</a></li>
     <li><a href="#support-android-stock-browser">Android stock browser</a></li>
     <li><a href="#support-validators">Validators</a></li>