[Compass Core] The has-layout mixin has been updated to emit less css.

It now uses a hacked zoom property to target ie6 and 7 only so that they
gain layout. If you prefer an approach that validates, set:

    $default-has-layout-approach: block;

and the has-layout mixin behavior will remain unchanged.

frameworks/compass/stylesheets/compass/utilities/general/_hacks.scss

@@ -1,12 +1,32 @@
+// The `zoom` approach generates less CSS but does not validate.
+// Set this to `block` to use the display-property to hack the
+// element to gain layout.
+$default-has-layout-approach: zoom !default;
+
 // This mixin causes an element matching the selector
 // to gain the "hasLayout" property in internet explorer.
 // More information on [hasLayout](http://reference.sitepoint.com/css/haslayout).
-@mixin has-layout {
+@mixin has-layout($using: $default-has-layout-approach) {
+  @if $using == zoom {
+    @include has-layout-zoom;
+  } @else if $using == block {
+    @include has-layout-block;
+  } @else {
+    @warn "Unknown has-layout approach: #{$using}";
+    @include has-layout-zoom;
+  }
+}
+
+@mixin has-layout-zoom {
+  *zoom: 1;
+}
+
+@mixin has-layout-block {
   // This makes ie6 get layout
   display: inline-block;
   // and this puts it back to block
-  & {
+  & { display: block; }
-    display: block; } }
+}
 
 // A hack to supply IE6 (and below) with a different property value.
 // [Read more](http://www.cssportal.com/css-hacks/#in_css-important).

test/fixtures/stylesheets/compass/css/images.css

@@ -5,4 +5,4 @@
   background-image: url('/images/4x6.png?busted=true'); }
 
 .absolute {
-  background-image: url(http://example.com/images/4x6.png); }
+  background-image: url(http://example.com/images/4x6.png); }

test/fixtures/stylesheets/compass/css/legacy_clearfix.css

@@ -0,0 +1,17 @@
+.clearfix {
+  overflow: hidden;
+  display: inline-block; }
+  .clearfix {
+    display: block; }
+
+.pie-clearfix {
+  display: inline-block; }
+  .pie-clearfix:after {
+    content: "\0020";
+    display: block;
+    height: 0;
+    clear: both;
+    overflow: hidden;
+    visibility: hidden; }
+  .pie-clearfix {
+    display: block; }

test/fixtures/stylesheets/compass/css/lists.css

@@ -4,9 +4,7 @@ ul.horizontal {
   border: 0;
   outline: 0;
   overflow: hidden;
-  display: inline-block; }
+  *zoom: 1; }
-  ul.horizontal {
-    display: block; }
   ul.horizontal li {
     list-style-image: none;
     list-style-type: none;
@@ -27,9 +25,7 @@ ul.wide-horizontal {
   border: 0;
   outline: 0;
   overflow: hidden;
-  display: inline-block; }
+  *zoom: 1; }
-  ul.wide-horizontal {
-    display: block; }
   ul.wide-horizontal li {
     list-style-image: none;
     list-style-type: none;
@@ -50,9 +46,7 @@ ul.right-horizontal {
   border: 0;
   outline: 0;
   overflow: hidden;
-  display: inline-block; }
+  *zoom: 1; }
-  ul.right-horizontal {
-    display: block; }
   ul.right-horizontal li {
     list-style-image: none;
     list-style-type: none;

test/fixtures/stylesheets/compass/css/utilities.css

@@ -1,11 +1,9 @@
 .clearfix {
   overflow: hidden;
-  display: inline-block; }
+  *zoom: 1; }
-  .clearfix {
-    display: block; }
 
 .pie-clearfix {
-  display: inline-block; }
+  *zoom: 1; }
   .pie-clearfix:after {
     content: "\0020";
     display: block;
@@ -13,5 +11,3 @@
     clear: both;
     overflow: hidden;
     visibility: hidden; }
-  .pie-clearfix {
-    display: block; }

test/fixtures/stylesheets/compass/sass/legacy_clearfix.scss

@@ -0,0 +1,11 @@
+$default-has-layout-approach: block;
+
+@import "compass/utilities";
+
+.clearfix {
+    @include clearfix;
+}
+
+.pie-clearfix {
+    @include pie-clearfix;
+}