From 3a99b98ad9ef1d7bfbcfbe4311147562ffefc4e6 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 8 Sep 2011 23:08:38 -0700 Subject: [PATCH] make dropdown menus appear above other elements on the page with a z-index --- bootstrap-1.3.0.css | 3 ++- bootstrap-1.3.0.min.css | 2 +- lib/patterns.less | 1 + 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/bootstrap-1.3.0.css b/bootstrap-1.3.0.css index 25bffa3af9..f0889f41ac 100644 --- a/bootstrap-1.3.0.css +++ b/bootstrap-1.3.0.css @@ -6,7 +6,7 @@ * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Date: Thu Sep 8 23:02:03 PDT 2011 + * Date: Thu Sep 8 23:07:35 PDT 2011 */ /* Reset.less * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc). @@ -1442,6 +1442,7 @@ a.menu:after, .dropdown-toggle:after { display: none; position: absolute; top: 40px; + z-index: 1000; min-width: 160px; max-width: 220px; _width: 160px; diff --git a/bootstrap-1.3.0.min.css b/bootstrap-1.3.0.min.css index 5124233b2a..22e59bd8b9 100644 --- a/bootstrap-1.3.0.min.css +++ b/bootstrap-1.3.0.min.css @@ -216,7 +216,7 @@ table .headerSortUp.purple,table .headerSortDown.purple{background-color:#e2d5f0 .topbar ul .menu-dropdown li a,.topbar ul .dropdown-menu li a{padding:4px 15px;} li.menu,.dropdown{position:relative;} a.menu:after,.dropdown-toggle:after{width:0;height:0;display:inline-block;content:"↓";text-indent:-99999px;vertical-align:top;margin-top:8px;margin-left:4px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #fff;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;} -.menu-dropdown,.dropdown-menu{background-color:#fff;float:left;display:none;position:absolute;top:40px;min-width:160px;max-width:220px;_width:160px;margin-left:0;margin-right:0;padding:6px 0;zoom:1;border-color:#999;border-color:rgba(0, 0, 0, 0.2);border-style:solid;border-width:0 1px 1px;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.menu-dropdown li,.dropdown-menu li{float:none;display:block;background-color:none;} +.menu-dropdown,.dropdown-menu{background-color:#fff;float:left;display:none;position:absolute;top:40px;z-index:1000;min-width:160px;max-width:220px;_width:160px;margin-left:0;margin-right:0;padding:6px 0;zoom:1;border-color:#999;border-color:rgba(0, 0, 0, 0.2);border-style:solid;border-width:0 1px 1px;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.menu-dropdown li,.dropdown-menu li{float:none;display:block;background-color:none;} .menu-dropdown .divider,.dropdown-menu .divider{height:1px;margin:5px 0;overflow:hidden;background-color:#eee;border-bottom:1px solid #fff;} .topbar .dropdown-menu a,.dropdown-menu a{display:block;padding:4px 15px;clear:both;font-weight:normal;line-height:18px;color:#808080;text-shadow:0 1px 0 #fff;}.topbar .dropdown-menu a:hover,.dropdown-menu a:hover{background-color:#dddddd;background-repeat:repeat-x;background-image:-khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));background-image:-moz-linear-gradient(top, #eeeeee, #dddddd);background-image:-ms-linear-gradient(top, #eeeeee, #dddddd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));background-image:-webkit-linear-gradient(top, #eeeeee, #dddddd);background-image:-o-linear-gradient(top, #eeeeee, #dddddd);background-image:linear-gradient(top, #eeeeee, #dddddd);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);color:#404040;text-decoration:none;-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);} .open .menu,.dropdown.open .menu,.open .dropdown-toggle,.dropdown.open .dropdown-toggle{color:#fff;background:#ccc;background:rgba(0, 0, 0, 0.3);} diff --git a/lib/patterns.less b/lib/patterns.less index b6d8a23ebc..e76cbd4754 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -240,6 +240,7 @@ a.menu:after, display: none; // None by default, but block on "open" of the menu position: absolute; top: 40px; + z-index: 900; min-width: 160px; max-width: 220px; _width: 160px; -- 2.47.2