stylesheets/toolkit/_clearfix.scss in toolkit-1.2.1 vs stylesheets/toolkit/_clearfix.scss in toolkit-1.2.2
- old
+ new
@@ -1,16 +1,78 @@
//////////////////////////////
+// Legacy Clearfix
+//
+// For when you need full Legacy support, including old IE and old Firefox
+//
+// From http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
+//////////////////////////////
+%clearfix-legacy {
+ /* for IE 6/7 */
+ *zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("br")).style.cssText="clear:both;font:0/0 serif");
+ /* non-JS fallback */
+ *zoom: 1;
+
+ &:before,
+ &:after {
+ content: ".";
+ display: block;
+ height: 0;
+ overflow: hidden;
+ }
+
+ &:after {
+ clear: both;
+ }
+}
+
+//////////////////////////////
+// Micro Clearfix
+//
+// For when you need old IE support, but not concerned with old Firefox
+// From http://nicolasgallagher.com/better-float-containment-in-ie/
+//////////////////////////////
+%clearfix-micro {
+ /* for IE 6/7 */
+ *zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("br")).style.cssText="clear:both;font:0/0 serif");
+ /* non-JS fallback */
+ *zoom: 1;
+
+ &:before,
+ &:after {
+ content: "";
+ display: table;
+ }
+
+ &:after {
+ clear: both;
+ }
+}
+
+//////////////////////////////
+// Modern Clearfix
+//
+// Clearfix for modern browsers, especiall when using border-box
+//
+// From http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
+//////////////////////////////
+%clearfix:after {
+ content: "";
+ display: table;
+ clear: both;
+}
+
+//////////////////////////////
// Massive Clearfix Mixin
//
// Clearfix mixin for all of your clearfixing needs. Will choose the right mixin for you.
// Can choose whether to extend or to write.
//////////////////////////////
$clearfix-extend: false !default;
$legacy-support-for-mozilla: true !default;
-@mixin clearfix($extend: $clearfix-extend, $direct: 'modern') {
- @if ($legacy-support-for-ie6 and $legacy-support-for-ie7 and not $legacy-support-for-mozilla) or ($direct == 'micro') {
+@mixin clearfix($extend: $clearfix-extend) {
+ @if $legacy-support-for-ie6 and $legacy-support-for-ie7 and not $legacy-support-for-mozilla {
@if $extend {
@extend %clearfix-micro;
}
@else {
/* for IE 6/7 */
@@ -27,11 +89,11 @@
&:after {
clear: both;
}
}
}
- @else if ($legacy-support-for-ie6 and $legacy-support-for-ie7 and $legacy-support-for-mozilla) or ($direct == 'legacy') {
+ @else if $legacy-support-for-ie6 and $legacy-support-for-ie7 and $legacy-support-for-mozilla {
@if $extend {
@extend %clearfix-legacy;
}
@else {
/* for IE 6/7 */
@@ -62,38 +124,6 @@
display: table;
clear: both;
}
}
}
-}
-
-//////////////////////////////
-// Legacy Clearfix
-//
-// For when you need full Legacy support, including old IE and old Firefox
-//
-// From http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
-//////////////////////////////
-%clearfix-legacy {
- @include clearfix(false, 'legacy');
-}
-
-//////////////////////////////
-// Micro Clearfix
-//
-// For when you need old IE support, but not concerned with old Firefox
-// From http://nicolasgallagher.com/better-float-containment-in-ie/
-//////////////////////////////
-%clearfix-micro {
- @include clearfix(false, 'micro');
-}
-
-//////////////////////////////
-// Modern Clearfix
-//
-// Clearfix for modern browsers, especiall when using border-box
-//
-// From http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
-//////////////////////////////
-%clearfix:after {
- @include clearfix(false, 'modern');
}
\ No newline at end of file