aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJacob Thornton <[email protected]>2011-08-21 18:07:47 -0700
committerJacob Thornton <[email protected]>2011-08-21 18:07:47 -0700
commite1e4ceee3f72d0892bf84aa7a1c7f1bdb719032e (patch)
treee1d6e737b7f9351dbee9b6921004c8f1bfbe3015
parent22dbf9d8e4fc5568d9d49b40d1c1020fbab064c9 (diff)
downloadbootstrap-e1e4ceee3f72d0892bf84aa7a1c7f1bdb719032e.tar.xz
bootstrap-e1e4ceee3f72d0892bf84aa7a1c7f1bdb719032e.zip
fix disabled button for ie 8 and below
-rw-r--r--bootstrap-1.0.0.css12
-rw-r--r--bootstrap-1.0.0.min.css3
-rw-r--r--docs/index.html5
-rw-r--r--lib/scaffolding.less8
4 files changed, 22 insertions, 6 deletions
diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css
index 1c25e55f0..5244c6f13 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 b9914b437..9dcfcc970 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 135483a83..a9351d861 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -857,6 +857,7 @@
</div>
<h3>Disabled state</h3>
<p>For buttons that are not active or are disabled by the app for one reason or another, use the disabled state. That’s <code>.disabled</code> for links and <code>:disabled</code> for <code>&lt;button&gt;</code> elements.</p>
+ <p><strong>Note:</strong> If you're developing for older browsers like IE8 or below -- you're going to want to use the <code>.disabled</code> class for <code>&lt;button&gt;</code> elements as well.
<h4>Links</h4>
<div class="well">
<a href="#" class="btn large primary disabled">Primary action</a>
@@ -864,8 +865,8 @@
</div>
<h4>Buttons</h4>
<div class="well">
- <button class="btn large primary" disabled>Primary action</button>
- <button class="btn large" disabled>Action</button>
+ <button class="btn large primary disabled" disabled>Primary action</button>
+ <button class="btn large disabled" disabled>Action</button>
</div>
</div>
</div>
diff --git a/lib/scaffolding.less b/lib/scaffolding.less
index f66e08679..b1f846a38 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);