Friday, July 3, 2009

CSS filter Google Chrome and Safari 3.1

CSS filter Google Chrome and Safari 3.1

Non-compliant selectors can be used and a valid way to target individual browsers. Chrome supports every selector, just like Safari 3.1. My recommendation is to use the body:first-of-type hack, the CSS hack/filter for Safari as a filter for Safari 3+ and Chrome. There should be no reason to target Chrome with the exclusion of Safari 3.1, but if you want to target both, filtering out Safari 3.0, I would try using:
body:nth-of-type(1) p{
color: #333333;
}
Only the Google Chrome and Safari 3.1 browsers will show paragraphs as grey. The logic is:

  • web pages only have one body element
  • only those two browsers support the pseudo-class of :nth-of-type()
  • body:nth-of-type(1) will match the first, and only, body element.
Use it as a predecessor to more specific selectors targeting the body’s children.

No comments: