CSS Hack for Safari

Safari のCSS Hackのまとめです。

Safari 3の検証には、2007年6月11日にリリースされた「Safari 3 ベータ版 for Windows XP」を使用しています。
※Safari 3の正式版は、2007年10月にリリース予定です。

• html*element
• sign after a semi-colon
• html:¥66irst-child
• html* box brackets
• html* underscore
• @media all
• body:last-child:not(:root:root)
• html[xmlns*=""] body:last-child
• body:first-of-type
• -webkit-min-device-pixel-ratio:0
• /**/ html*

下記の10個のうち、Safari 3のみ有効だったのはbody:first-of-typeでした、Safari 2,3 用はhtml* box brackets、@media allの２つ、Safari 2用はsign after a semi-colon、body:last-child:not(:root:root)、html[xmlns*=""] body:last-childの３つが有効でした。
Safari 3 の正式版がリリースされるとまた状況が変わると思いますが、まずは予備知識として。

html*element

NG

WinXP: Firefox 2
MacOSX: Firefox 2

OK

WinXP: IE 7, IE 6, Opera 9, Safari 3
MacOSX: Safari 2

[demo]

sign after a semi-colon

NG

WinXP: IE 7, IE 6, Firefox 2, Opera 9, Safari 3
MacOSX: Firefox 2

OK

MacOSX: Safari 2

[demo]

html:¥66irst-child

NG

WinXP: IE 7, IE 6, Firefox 2, Safari 3
MacOSX: Firefox 2

OK

WinXP: Opera 9
MacOSX: Safari 2

[demo]

html* box brackets

NG

WinXP: IE 7, IE 6, Firefox 2, Opera 9
MacOSX: Firefox 2

OK

WinXP: Safari 3
MacOSX: Safari 2

[demo]

html* underscore

NG

WinXP: IE 6 Firefox 2, Opera 9
MacOSX: Firefox 2

OK

WinXP: IE 7, Safari 3
MacOSX: Safari 2

[demo]

@media all

NG

WinXP: IE 7, IE 6, Firefox 2, Opera 9
MacOSX: Firefox 2

OK

WinXP: Safari 3
MacOSX: Safari 2

[demo]

body:last-child:not(:root:root)

NG

WinXP: IE 7, IE 6, Firefox 2, Opera 9, Safari 3
MacOSX: Firefox 2

OK

MacOSX: Safari 2

[demo]

html[xmlns*=""] body:last-child

NG

WinXP: IE 7, IE 6, Firefox 2, Opera 9, Safari 3
MacOSX: Firefox 2

OK

MacOSX: Safari 2

[demo]

body:first-of-type

NG

WinXP: IE 7, IE 6, Firefox 2, Opera 9
MacOSX: Firefox 2, Safari 2

OK

WinXP: Safari 3

[demo] [via]

-webkit-min-device-pixel-ratio:0

NG

WinXP: IE 7, IE 6, Firefox 2
MacOSX: Firefox 2, Safari 2

OK

WinXP: Opera 9, Safari 3

[demo] [via]

/**/ html*

NG

WinXP: Firefox 2, Opera 9
MacOSX: Firefox 2

OK

WinXP: IE 7, IE 6, Safari 3
MacOSX: Safari 2

[demo] [via]

Safari 3 ベータ版のダウンロードやUAに関しては、下記ページを参照ください。
Safari 3 for Windowsのベータ版のユーザーエージェント
[コリス]

Post on:2007年6月12日