From e1e4ceee3f72d0892bf84aa7a1c7f1bdb719032e Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Sun, 21 Aug 2011 18:07:47 -0700 Subject: [PATCH] fix disabled button for ie 8 and below --- bootstrap-1.0.0.css | 12 ++++++++++-- bootstrap-1.0.0.min.css | 3 ++- docs/index.html | 5 +++-- lib/scaffolding.less | 8 +++++++- 4 files changed, 22 insertions(+), 6 deletions(-) diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css index 1c25e55f..5244c6f1 100644 --- a/bootstrap-1.0.0.css +++ b/bootstrap-1.0.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: Sun Aug 21 13:35:51 PDT 2011 + * Date: Sun Aug 21 18:07:44 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). @@ -445,7 +445,15 @@ a:hover { padding-left: 9px; font-size: 11px; } -.btn:disabled, .btn.disabled { +.btn.disabled { + background-image: none; + filter: alpha(opacity=65); + -khtml-opacity: 0.65; + -moz-opacity: 0.65; + opacity: 0.65; + cursor: default; +} +.btn:disabled { background-image: none; filter: alpha(opacity=65); -khtml-opacity: 0.65; diff --git a/bootstrap-1.0.0.min.css b/bootstrap-1.0.0.min.css index b9914b43..9dcfcc97 100644 --- a/bootstrap-1.0.0.min.css +++ b/bootstrap-1.0.0.min.css @@ -51,7 +51,8 @@ a{color:#0069d6;text-decoration:none;line-height:inherit;}a:hover{color:#0050a3; .btn.primary{background-color:#0064cd;background-repeat:repeat-x;background-image:-khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd));background-image:-moz-linear-gradient(#049cdb, #0064cd);background-image:-ms-linear-gradient(#049cdb, #0064cd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd));background-image:-webkit-linear-gradient(#049cdb, #0064cd);background-image:-o-linear-gradient(#049cdb, #0064cd);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0)";filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0);background-image:linear-gradient(#049cdb, #0064cd);color:#fff;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);border-bottom-color:#003f81;border-bottom-color:rgba(0, 0, 0, 0.25);}.btn.primary:hover{color:#fff;} .btn.large{font-size:16px;line-height:28px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;} .btn.small{padding-right:9px;padding-left:9px;font-size:11px;} -.btn:disabled,.btn.disabled{background-image:none;filter:alpha(opacity=65);-khtml-opacity:0.65;-moz-opacity:0.65;opacity:0.65;cursor:default;} +.btn.disabled{background-image:none;filter:alpha(opacity=65);-khtml-opacity:0.65;-moz-opacity:0.65;opacity:0.65;cursor:default;} +.btn:disabled{background-image:none;filter:alpha(opacity=65);-khtml-opacity:0.65;-moz-opacity:0.65;opacity:0.65;cursor:default;} .btn:active{-webkit-box-shadow:inset 0 3px 7px rgba(0, 0, 0, 0.1),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 3px 7px rgba(0, 0, 0, 0.1),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 3px 7px rgba(0, 0, 0, 0.1),0 1px 2px rgba(0, 0, 0, 0.05);} button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;border:0;} p{font-size:13px;font-weight:normal;line-height:18px;margin-bottom:9px;}p small{font-size:11px;color:#bfbfbf;} diff --git a/docs/index.html b/docs/index.html index 135483a8..a9351d86 100644 --- a/docs/index.html +++ b/docs/index.html @@ -857,6 +857,7 @@

Disabled state

For buttons that are not active or are disabled by the app for one reason or another, use the disabled state. That’s .disabled for links and :disabled for <button> elements.

+

Note: If you're developing for older browsers like IE8 or below -- you're going to want to use the .disabled class for <button> elements as well.

Links

Primary action @@ -864,8 +865,8 @@

Buttons

- - + +
diff --git a/lib/scaffolding.less b/lib/scaffolding.less index f66e0867..b1f846a3 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -117,12 +117,18 @@ a { padding-left: 9px; font-size: 11px; } - &:disabled, &.disabled { background-image: none; .opacity(65); cursor: default; } + + // this can't be included with the .disabled def because IE8 and below will drop it ;_; + &:disabled { + background-image: none; + .opacity(65); + cursor: default; + } &:active { @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05); .box-shadow(@shadow);