make component animations work cross browsers with opacity mixin, restore float on thumbnails > li

This commit is contained in:
Mark Otto 2012-04-24 06:39:14 -07:00
parent e659dc7e1b
commit f9744ff522
3 changed files with 12 additions and 8 deletions

View File

@ -2499,6 +2499,7 @@ table .span24 {
.fade {
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 0.15s linear;
-moz-transition: opacity 0.15s linear;
-ms-transition: opacity 0.15s linear;
@ -2508,6 +2509,7 @@ table .span24 {
.fade.in {
opacity: 1;
filter: alpha(opacity=100);
}
.collapse {
@ -4445,6 +4447,7 @@ input[type="submit"].btn.btn-mini {
}
.thumbnails > li {
float: left;
margin-bottom: 18px;
}
@ -4647,15 +4650,15 @@ a.badge:hover {
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: width 0.6s ease;
-moz-transition: width 0.6s ease;
-ms-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.progress-striped .bar {

View File

@ -2,17 +2,17 @@
// --------------------
.fade {
opacity: 0;
.opacity(0);
.transition(opacity .15s linear);
&.in {
opacity: 1;
.opacity(100);
}
}
.collapse {
position:relative;
position: relative;
height: 0;
overflow:hidden;
overflow: hidden;
.transition(height .35s ease);
&.in {
height: auto;

View File

@ -14,6 +14,7 @@
// Float li to make thumbnails appear in a row
.thumbnails > li {
float: left; // Explicity set the float since we don't require .span* classes
margin-bottom: @baseLineHeight;
}