Mac FireFox3も背景がずれる・・・。

CSSでbodyに設定した背景画像がIEでずれる怪Safari3も背景がずれる・・。で、IEとSafariの困ったバグの話をしましたが、今回はFireFoxです。それもMac限定。orz….。

MacFireFox3もFireFox2とは違い背景ずれます。
なおWindows FireFox3ではこのバグはない模様。

ひょんなんことからMacFireFoxをアップデートする前に上げたサイトをのぞいてみると・・・なんか、右にずれてる。

そのサイトもIE7とSafari用に背景を左に1pxハックしているため、それが原因かな?と思ったため、ハックを外してみても表示は変わらず。
もしや( ̄▽ ̄;
あわてて検索してみる。


ありましたね。FireFox3のハック
Firefox3でCSSバグに対応するCSSハック | Lovelog *
Firefox 3 CSS hack – CSS – Snipplr

しかし・・前バージョンでは大丈夫だったのに、今バージョンでは右にずれるってどういう事じゃ!

  1. /* FireFox 2 */
    (該当class、またはID), x:-moz-any-link
    {
    (ユーザーの設定値)
    }
  2. /* FireFox 3 */
    (該当class、またはID), x:-moz-any-link, x:default
    {
    (ユーザーの設定値)
    }
  3. /* Only FireFox 3 */
    html>/**/body (該当class、またはID), x:-moz-any-link, x:default
    {
    (ユーザーの設定値)
    }

・・・という形でハックできます。( )でくくっている場所に、該当する内容を追加すればOK。
「FireFox3のみ」のハックについては、bodyについてハックする場合(該当class、またはID)はなくていいです。

同じFireFoxでもWindows版はどうなの?というところですが、今のところバグは確認していません。上記のハックもWindows版では無効になるようです。

今回私が利用したのは
/* FireFox 3 only */
html>/**/body, x:-moz-any-link, x:default
{
padding-right: 1px;
}

・・という形だったのですが、右1pxずらしているにも関わらずWindows版ではずれません。
少なくとも同じver.3でも、Mac側には有効になりWindows版では無効になっているようです。
・・なんて面倒なorz….

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です