株式会社プロネット

 

WEBシステム開発、ITコンサルティング、自社サービス、教育事業 - これからのビジネスへのIT活用ソリューションをご提案致します。

FireFoxでNegativeMarginを指定するとinline-blockがカラム落ちする

2018.1.25(Thu) 11:32 | CSS | oshima

FireFoxでNegativeMarginを指定するとinline-blockがカラム落ちする

要素を横並びにする際inline-blockを指定したところ、なぜか初回だけカラム落ちが発生。
原因を調べてみたらinline-blockの要素の親divにnegative marginを指定していたことでした。

環境

FireFox57 win,mac

改善策

margin-topにネガティブを指定するのではなく、top要素にマイナスを指定したところ直りました。
 

#negative {
    top:-180px;
    width:600px;
}

.inlineBlock {
   display:inline-block;
   width:140px;
}

 

» Tags: サイト