Comments on: Detect Safari 3 via CSS / DOM http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/ Keep It Simple, Stupid Thu, 25 Dec 2008 02:24:29 +0000 http://wordpress.org/?v=2.0.5 by: BTreeHugger http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-226 Sun, 15 Jun 2008 17:07:01 +0000 http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-226 If you don't want to reverse anything, but want to target only Opera 9 up: @media all and (-webkit-min-device-pixel-ratio:10000) {} If you want to target Webkit only, then use a min-ratio of 0 and prepend this to each hack inside the query: body:not(:root:root) You can also prepend :root to each selector in the Opera-only one to target only Opera 9.5, and prepend :lang(e) or another "too short" language name to target only Opera 9 before 9.5. If you don’t want to reverse anything, but want to target only Opera 9 up:

@media all and (-webkit-min-device-pixel-ratio:10000) {}

If you want to target Webkit only, then use a min-ratio of 0 and prepend this to each hack inside the query:
body:not(:root:root)

You can also prepend :root to each selector in the Opera-only one to target only Opera 9.5, and prepend :lang(e) or another “too short” language name to target only Opera 9 before 9.5.

]]>
by: ultimate http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-149 Fri, 16 Nov 2007 12:13:56 +0000 http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-149 @media all and (-webkit-min-device-pixel-ratio:0){ #sampleId{/*for WebKit*/} html:first-child #sampleId{/* for Opera */} } @media all and (-webkit-min-device-pixel-ratio:0){
#sampleId{/*for WebKit*/}
html:first-child #sampleId{/* for Opera */}
}

]]>
by: Cezary Okupski http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-148 Fri, 16 Nov 2007 11:41:08 +0000 http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-148 Actually, there's a shorter way to do it (remember about the space after "and"): @media all and (-webkit-min-device-pixel-ratio:0){ #sampleId{/*for WebKit*/} html:first-child>body #sampleId{/* for Opera */} } Actually, there’s a shorter way to do it (remember about the space after “and”):
@media all and (-webkit-min-device-pixel-ratio:0){
#sampleId{/*for WebKit*/}
html:first-child>body #sampleId{/* for Opera */}
}

]]>
by: Cezary Okupski http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-147 Fri, 16 Nov 2007 11:24:44 +0000 http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-147 It seems that WebKit has got a problem with a space between the operator "and" and the second argument which is (-webkit-min-device-pixel-ratio:0). Therefore you can write @media all and (-webkit-min-device-pixel-ratio:0){ /* Safari 3 & Opera */ } and later in the cascade @media all and(-webkit-min-device-pixel-ratio:0){ /* Opera */ } to overwrite it for Opera. This is a complete hack for it. It seems that WebKit has got a problem with a space between the operator “and” and the second argument which is (-webkit-min-device-pixel-ratio:0). Therefore you can write
@media all and (-webkit-min-device-pixel-ratio:0){
/* Safari 3 & Opera */
}
and later in the cascade
@media all and(-webkit-min-device-pixel-ratio:0){
/* Opera */
}
to overwrite it for Opera. This is a complete hack for it.

]]>
by: hedgerwang http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-105 Thu, 12 Jul 2007 17:32:52 +0000 http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-105 Thanks for the update. Thanks for the update.

]]>
by: Chris Griego http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-104 Thu, 12 Jul 2007 16:58:58 +0000 http://blog.hedgerwow.com/2007/06/22/detect-safari-3-via-css/#comment-104 CSS test applies in Opera 9. CSS test applies in Opera 9.

]]>