[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.
This commit is contained in:
parent
0aedf01375
commit
922fc8c1a2
@ -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).
|
||||
|
@ -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); }
|
||||
|
17
test/fixtures/stylesheets/compass/css/legacy_clearfix.css
vendored
Normal file
17
test/fixtures/stylesheets/compass/css/legacy_clearfix.css
vendored
Normal file
@ -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; }
|
12
test/fixtures/stylesheets/compass/css/lists.css
vendored
12
test/fixtures/stylesheets/compass/css/lists.css
vendored
@ -4,9 +4,7 @@ ul.horizontal {
|
||||
border: 0;
|
||||
outline: 0;
|
||||
overflow: hidden;
|
||||
display: inline-block; }
|
||||
ul.horizontal {
|
||||
display: block; }
|
||||
*zoom: 1; }
|
||||
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; }
|
||||
ul.wide-horizontal {
|
||||
display: block; }
|
||||
*zoom: 1; }
|
||||
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; }
|
||||
ul.right-horizontal {
|
||||
display: block; }
|
||||
*zoom: 1; }
|
||||
ul.right-horizontal li {
|
||||
list-style-image: none;
|
||||
list-style-type: none;
|
||||
|
@ -1,11 +1,9 @@
|
||||
.clearfix {
|
||||
overflow: hidden;
|
||||
display: inline-block; }
|
||||
.clearfix {
|
||||
display: block; }
|
||||
*zoom: 1; }
|
||||
|
||||
.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; }
|
||||
|
11
test/fixtures/stylesheets/compass/sass/legacy_clearfix.scss
vendored
Normal file
11
test/fixtures/stylesheets/compass/sass/legacy_clearfix.scss
vendored
Normal file
@ -0,0 +1,11 @@
|
||||
$default-has-layout-approach: block;
|
||||
|
||||
@import "compass/utilities";
|
||||
|
||||
.clearfix {
|
||||
@include clearfix;
|
||||
}
|
||||
|
||||
.pie-clearfix {
|
||||
@include pie-clearfix;
|
||||
}
|
Loading…
Reference in New Issue
Block a user