Substitute :last-child for :first-child for IE 7 support

Consider the following:

ul li {
   display: inline;
   margin-right: 10px;
   padding-right: 10px;
   border-right: 1px solid red;
}

ul li:last-child {
   margin-right: 0;
   padding-right: 0;
   border-right: 0;
}

This bit of CSS would give you perfect line separators in IE8+. But since IE 7 supports the :first-child pseudo-class, we can do one better:

ul li {
   display: inline;
   margin-left: 10px;
   padding-left: 10px;
   border-left: 1px solid red;
}

ul li:first-child {
   margin-left: 0;
   padding-left: 0;
   border-left: 0;
}

Same* result, with more browser support.
*Substitute for “sane”.

del.icio.us:Substitute :last-child for :first-child for IE 7 supportdigg:Substitute :last-child for :first-child for IE 7 support

Post a Comment

Your email is never published nor shared. Required fields are marked *
*
*