IE8 compat for :last-child selector

This commit is contained in:
Jeff Siegel 2010-10-29 02:06:18 -06:00 committed by Chris Eppstein
parent a03ee6cb8f
commit 762c6a0b18
4 changed files with 20 additions and 3 deletions

View File

@ -16,6 +16,7 @@ COMPASS CHANGELOG
* You can now pass --no-line-comments to the Compass command line to disable line comments. * You can now pass --no-line-comments to the Compass command line to disable line comments.
* Make the compass configuration file more self documenting by adding comments for * Make the compass configuration file more self documenting by adding comments for
`preferred_syntax`, `output_style`, and `line_comments`. `preferred_syntax`, `output_style`, and `line_comments`.
* Work around IE compatibility issues with the :last-child selector. [Commit](http://github.com/jdsiegel/compass/commit/c1fb764dba9c54cc5d02f2f7de213fb21ac6ca09).
0.10.6 (10/11/2010) 0.10.6 (10/11/2010)
------------------- -------------------

View File

@ -31,6 +31,9 @@
// //
// :last-child is not fully supported // :last-child is not fully supported
// see http://www.quirksmode.org/css/contents.html#t29 for the support matrix // see http://www.quirksmode.org/css/contents.html#t29 for the support matrix
//
// IE8 ignores rules that are included on the same line as :last-child
// see http://www.richardscarrott.co.uk/posts/view/ie8-last-child-bug for details
// //
// Setting `$padding` to `false` disables the padding between list elements // Setting `$padding` to `false` disables the padding between list elements
@mixin horizontal-list-item($padding: 4px, $direction: left) { @mixin horizontal-list-item($padding: 4px, $direction: left) {
@ -43,7 +46,8 @@
right: $padding; right: $padding;
} }
&:first-child, &.first { padding-#{$direction}: 0; } &:first-child, &.first { padding-#{$direction}: 0; }
&:last-child, &.last { padding-#{opposite-position($direction)}: 0; } &:last-child { padding-#{opposite-position($direction)}: 0; }
&.last { padding-#{opposite-position($direction)}: 0; }
} }
} }

View File

@ -17,12 +17,18 @@
// //
// `:last-child` is not fully supported. // `:last-child` is not fully supported.
// see quirksmode for the [support matrix](http://www.quirksmode.org/css/contents.html#t29). // see quirksmode for the [support matrix](http://www.quirksmode.org/css/contents.html#t29).
//
// IE8 ignores rules that are included on the same line as :last-child
// see http://www.richardscarrott.co.uk/posts/view/ie8-last-child-bug for details
@mixin comma-delimited-list { @mixin comma-delimited-list {
@include inline-list; @include inline-list;
li { li {
&:after { content: ", "; } &:after { content: ", "; }
&:last-child, &.last { &:last-child {
&:after { content: ""; }
}
&.last {
&:after { content: ""; } &:after { content: ""; }
} }
} }

View File

@ -20,8 +20,14 @@
&:last-child, &:last-child,
&.last { &.last {
border-right-width: 0px; } } border-right-width: 0px; } }
// IE8 ignores rules that are included on the same line as :last-child
// see http://www.richardscarrott.co.uk/posts/view/ie8-last-child-bug for details
tbody, tfoot { tbody, tfoot {
tr:last-child, tr:last-child {
th, td {
border-bottom-width: 0px; } }
tr.last { tr.last {
th, td { th, td {
border-bottom-width: 0px; } } } } border-bottom-width: 0px; } } } }