Safari 2 Specific CSS Hack?

So I’m going to get to the point with this post. I was tinkering, and may have found a CSS hack that targets only IE7 and Safari 2.0. You can then of course override the the style with a IE7 specific hack, thus using this technique to target Safari 2.0 alone.

Now, I don’t like the use of hacks, but I am very curious if this works. I know it could probably come in handy to many developers when working with Safari.

I have not yet tested this on Safari 3.0. This is a list of browsers I have tested on:

• IE6 - Windows 2000
• IE7 - Windows Vista
• Firefox 2.0.0.4 - Windows Vista
• Safari 2.0.4 - OS X
• Firefox 2.0.0.4 - OS X
• Opera 9.20 - OS X

As I mentioned before, this hack seems to only target IE7 and Safari 2.0. So lets move on to the code and an example.

/*/*/html*.text_field_wrap>div {display:none;}/* */
*+html .text_field_wrap div {display:block;}

This example will simply tell a div to display in Safari. The second CSS line resets the style for IE7. The ending result will only effect Safari 2.0. To see this CSS example in action, view the sample by clicking here.

So, try it out. And please leave a comment with any findings. Thanks.

Update

I have tested this on Safari 3.0 beta / Windows Vista. And it worked. So maybe I have also found a CSS hack for Safari 3.0. Which could be helpful in the near future.

Please leave comments with your browser information and whether you saw the green or red box. It doesnt matter what browser you have. I just want to gather more info on this. Thanks.