1580 lines
46 KiB
HTML
1580 lines
46 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
|
||
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||
|
||
<title>
|
||
|
||
Black Dashboard Flask by Creative Tim
|
||
|
||
|
||
|
||
|
||
|
||
</title>
|
||
|
||
|
||
|
||
<!-- Fonts and icons -->
|
||
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||
|
||
<!-- Nucleo Icons -->
|
||
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||
<!-- CSS Files -->
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<!-- Documentation extras -->
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||
|
||
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||
|
||
<style>
|
||
.navbar-absolute-logo{
|
||
padding-left: 45px;
|
||
}
|
||
.navbar-absolute-logo img{
|
||
position: absolute;
|
||
left: 15px;
|
||
margin-top: -6px;
|
||
}
|
||
body{
|
||
background: white;
|
||
}
|
||
</style>
|
||
|
||
|
||
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||
|
||
|
||
|
||
</head>
|
||
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||
|
||
|
||
<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>
|
||
|
||
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||
Black Dashboard Flask
|
||
</a>
|
||
|
||
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||
<li class="nav-item">
|
||
<a class="nav-link p-2" href="#version">
|
||
1.0.0
|
||
</a>
|
||
</li>
|
||
|
||
<!-- <li class="nav-item dropdown">
|
||
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||
v2.0.0
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||
</div>
|
||
</li> -->
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
|
||
<div class="navbar-nav-scroll ml-md-auto ">
|
||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||
<li class="nav-item">
|
||
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||
|
||
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||
</header>
|
||
|
||
|
||
<div class="container-fluid">
|
||
<div class="row flex-xl-nowrap">
|
||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||
<nav class="collapse bd-links" id="bd-docs-nav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item active">
|
||
<a class="bd-toc-link" href="#docs">
|
||
Getting started
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||
Getting Started Flask
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/getting-started/license.html">
|
||
License
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item active">
|
||
<a class="bd-toc-link" href="#docs">
|
||
Foundation
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/foundation/colors.html">
|
||
Colors
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item active">
|
||
<a class="bd-toc-link" href="#docs">
|
||
Components
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/alerts.html">
|
||
Alerts
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/badge.html">
|
||
Badge
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||
Breadcrumb
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/buttons.html">
|
||
Buttons
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/card.html">
|
||
Card
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/collapse.html">
|
||
Collapse
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/dropdowns.html">
|
||
Dropdowns
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/forms.html">
|
||
Forms
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/google-maps.html">
|
||
Google Maps
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/modal.html">
|
||
Modal
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/navs.html">
|
||
Navs
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/navbar.html">
|
||
Navbar
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||
Nucleo Icons
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/components/tables.html">
|
||
Tables
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item active">
|
||
<a class="bd-toc-link" href="#docs">
|
||
Plugins
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||
Perfect Scrollbar
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
|
||
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||
Chart.js
|
||
</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
</nav>
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||
<h1 class="bd-title" id="content">Wall of browser bugs</h1>
|
||
<p class="bd-lead"></p>
|
||
<p>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="/docs/1.0/getting-started/browsers-devices/#supported-browsers">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>
|
||
|
||
<table class="bd-browser-bugs table table-bordered table-hover table-responsive">
|
||
<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>Edge
|
||
</td>
|
||
<td><p>Visual artifacts in scrollable modal dialogs</p>
|
||
</td>
|
||
<td><a href="https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/9011176">Edge issue #9011176</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20755">#20755</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>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>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>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>Edge
|
||
</td>
|
||
<td><p><code class="highlighter-rouge">background</code> of <code class="highlighter-rouge"><tr></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>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>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>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>Edge
|
||
</td>
|
||
<td><p>Active <code class="highlighter-rouge">position: fixed;</code> <code class="highlighter-rouge"><button></code> flickers when scrolling</p>
|
||
</td>
|
||
<td><a href="https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8770398">Edge issue #8770398</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20507">#20507</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>Firefox
|
||
</td>
|
||
<td><p><code class="highlighter-rouge">.table-bordered</code> with an empty <code class="highlighter-rouge"><tbody></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>Layout with floated columns breaks when printing</p>
|
||
</td>
|
||
<td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1315994">Mozilla bug #1315994</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/21092">#21092</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>Firefox (Windows)
|
||
</td>
|
||
<td><p>Right border of <code class="highlighter-rouge"><select></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"><input></code> in a scrollable overlay doesn’t scroll the <code class="highlighter-rouge"><input></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"><input type="number"></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">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=568691">Chromium issue #568691</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"><select multiple></code> with overflowed options will select nearby <code class="highlighter-rouge"><option></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
|
||
</td>
|
||
<td><p><code class="highlighter-rouge">position: absolute</code> element that’s wider than its column is incorrectly clipped to column boundary</p>
|
||
</td>
|
||
<td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=269061">Chromium issue #269061</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20161">#20161</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
|
||
</td>
|
||
<td><p>Link to container with id and tabindex results in container being ignored by VoiceOver (affects skip links)</p>
|
||
</td>
|
||
<td><a href="https://bugs.webkit.org/show_bug.cgi?id=163658">WebKit bug #163658</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20732">#20732</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"><input type="number"></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 (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"><input type="text"></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"><input></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"><body></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"><input></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"><body></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"><body></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>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 (iOS)
|
||
</td>
|
||
<td><p>Element which is <code class="highlighter-rouge">position:fixed</code> disappears after opening a <code class="highlighter-rouge"><select></code> menu</p>
|
||
</td>
|
||
<td><a href="https://bugs.webkit.org/show_bug.cgi?id=162362">WebKit bug #162362</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20759">#20759</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>
|
||
|
||
<h1 id="most-wanted-features">Most wanted features</h1>
|
||
|
||
<p>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>
|
||
|
||
<table class="bd-browser-bugs table table-bordered table-hover table-responsive">
|
||
<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>Edge
|
||
</td>
|
||
<td><p>Focusable elements should fire focus event / receive :focus styling when they receive Narrator/accessibility focus</p>
|
||
</td>
|
||
<td><a href="https://microsoftaccessibility.uservoice.com/forums/307429-microsoft-accessibility-feedback/suggestions/16717318">Microsoft A11y UserVoice idea #16717318</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20732">#20732</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>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>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>Edge
|
||
</td>
|
||
<td><p>Implement the HTML5 <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog"><code class="highlighter-rouge"><dialog></code> element</a></p>
|
||
</td>
|
||
<td><a href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6508895">Edge UserVoice idea #6508895</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20175">#20175</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>Edge
|
||
</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://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/15939898">Edge UserVoice idea #15939898</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20618">#20618</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>Edge
|
||
</td>
|
||
<td><p>Implement the <a href="http://caniuse.com/#feat=css-nth-child-of"><code class="highlighter-rouge">of <selector-list></code> clause</a> of the <code class="highlighter-rouge">:nth-child()</code> pseudo-class</p>
|
||
</td>
|
||
<td><a href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/15944476">Edge UserVoice idea #15944476</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20143">#20143</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 <selector-list></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"><dialog></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>Firefox
|
||
</td>
|
||
<td><p>When virtual focus is on a button or link, fire actual focus on the element, too</p>
|
||
</td>
|
||
<td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1000082">Mozilla bug #1000082</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20732">#20732</a>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>Chrome
|
||
</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://bugs.chromium.org/p/chromium/issues/detail?id=642487">Chromium issue #642487</a>
|
||
</td>
|
||
<td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=437860">Chromium issue #437860</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 <selector-list></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>Safari
|
||
</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://bugs.webkit.org/show_bug.cgi?id=161535">WebKit bug #161535</a>
|
||
</td>
|
||
<td><a href="https://github.com/twbs/bootstrap/issues/20618">#20618</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"><dialog></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>
|
||
|
||
</main>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<!-- Core JS Files -->
|
||
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||
|
||
|
||
|
||
|
||
<!-- Google Maps Plugin -->
|
||
|
||
<!-- Place this tag in your head or just before your close body tag. -->
|
||
|
||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||
|
||
|
||
<!-- Chart JS -->
|
||
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||
|
||
<!-- Notifications Plugin -->
|
||
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||
|
||
|
||
|
||
|
||
|
||
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||
|
||
|
||
|
||
<script>
|
||
$(document).ready(function(){
|
||
$().ready(function(){
|
||
$sidebar = $('.sidebar');
|
||
$navbar = $('.navbar');
|
||
$main_panel = $('.main-panel');
|
||
|
||
$full_page = $('.full-page');
|
||
|
||
$sidebar_responsive = $('body > .navbar-collapse');
|
||
sidebar_mini_active = true;
|
||
white_color = false;
|
||
|
||
window_width = $(window).width();
|
||
|
||
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||
|
||
|
||
|
||
$('.fixed-plugin a').click(function(event){
|
||
if($(this).hasClass('switch-trigger')){
|
||
if(event.stopPropagation){
|
||
event.stopPropagation();
|
||
}
|
||
else if(window.event){
|
||
window.event.cancelBubble = true;
|
||
}
|
||
}
|
||
});
|
||
|
||
$('.fixed-plugin .background-color span').click(function(){
|
||
$(this).siblings().removeClass('active');
|
||
$(this).addClass('active');
|
||
|
||
var new_color = $(this).data('color');
|
||
|
||
if($sidebar.length != 0){
|
||
$sidebar.attr('data',new_color);
|
||
}
|
||
|
||
if($main_panel.length != 0){
|
||
$main_panel.attr('data',new_color);
|
||
}
|
||
|
||
if($full_page.length != 0){
|
||
$full_page.attr('filter-color',new_color);
|
||
}
|
||
|
||
if($sidebar_responsive.length != 0){
|
||
$sidebar_responsive.attr('data',new_color);
|
||
}
|
||
});
|
||
|
||
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||
var $btn = $(this);
|
||
|
||
if(sidebar_mini_active == true){
|
||
$('body').removeClass('sidebar-mini');
|
||
sidebar_mini_active = false;
|
||
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||
}else{
|
||
$('body').addClass('sidebar-mini');
|
||
sidebar_mini_active = true;
|
||
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||
}
|
||
|
||
// we simulate the window Resize so the charts will get updated in realtime.
|
||
var simulateWindowResize = setInterval(function(){
|
||
window.dispatchEvent(new Event('resize'));
|
||
},180);
|
||
|
||
// we stop the simulation of Window Resize after the animations are completed
|
||
setTimeout(function(){
|
||
clearInterval(simulateWindowResize);
|
||
},1000);
|
||
});
|
||
|
||
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||
var $btn = $(this);
|
||
|
||
if(white_color == true){
|
||
|
||
$('body').addClass('change-background');
|
||
setTimeout(function(){ $('body').removeClass('change-background');
|
||
$('body').removeClass('white-content'); }, 900);
|
||
white_color = false;
|
||
}else{
|
||
|
||
$('body').addClass('change-background');
|
||
setTimeout(function(){ $('body').removeClass('change-background');
|
||
$('body').addClass('white-content');}, 900);
|
||
|
||
white_color = true;
|
||
}
|
||
|
||
|
||
});
|
||
|
||
$('.light-badge').click(function(){
|
||
$('body').addClass('white-content');
|
||
});
|
||
|
||
$('.dark-badge').click(function(){
|
||
$('body').removeClass('white-content');
|
||
});
|
||
});
|
||
});
|
||
</script>
|
||
|
||
|
||
|
||
|
||
<script src="../../../assets/demo/docs.min.js"></script>
|
||
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||
<script src="../../../assets/demo/src/application.js"></script>
|
||
|
||
<script>
|
||
$(document).ready(function(){
|
||
if($('#lineChartExample').length != 0){
|
||
demo.initDocChart();
|
||
}
|
||
|
||
|
||
|
||
|
||
});
|
||
</script>
|
||
|
||
<script>
|
||
Holder.addTheme('gray', {
|
||
bg: '#777',
|
||
fg: 'rgba(255,255,255,.75)',
|
||
font: 'Helvetica',
|
||
fontweight: 'normal'
|
||
})
|
||
</script>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||
window.TrackJS &&
|
||
TrackJS.install({
|
||
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||
application: "black-dashboard-free"
|
||
});
|
||
</script>
|
||
|
||
|
||
</body>
|
||
</html>
|