- 締切済み
Firefox15.0におけるborderの挙動
Firefox15.0環境でのborderの挙動についての質問です。 divをfloatで並べてレイアウトし、borderで境界線を描画しております。 その際、border-widthを1pxで設定しているのですが、Firefox15.0環境だとborderが若干太くなってしまい、レイアウトが崩れるケースがあります。 Firebugにて確認した所、1pxの指定が実際には1.1167pxという半端な値が設定されていました。 ところが、問題のレイアウト箇所のみ別HTMLに抜き出して確認した所、border-widthは1pxのままでレイアウトは崩れませんでした。 この状況から、他のCSS設定や親要素からの継承が影響しているのだろうと考え、調べたのですが、Firebug上ではレイアウトが崩れる場合(完全版)と、レイアウトが崩れない環境(抜粋版)との間にCSSの設定の相違はありませんでした。 ちなみに、他に試したブラウザです IE6 IE9 Firefox12 では上記問題は起こらず、正常に表示されました。 書くまでもないぐらいのざっくりした感じですがソースは以下のようなイメージです。 //css div.main{ width:500px; height:500px; } div.a{ width:30px; height:30px; border:1px solid black; float:left; } div.main{ width:60px; height:30px; border:1px solid black; float:left; } //html <div class="main"> <div> <div class="a"></div><div class="a"></div><div class="a"></div><div class="a"></div> </div> <div> <div class="b"></div><div class="b"></div> </div> </div> これだけの情報では解決策を頂けないのは重々承知しているので、何かヒントや直接的には繋がりがなくとも、border-widthのおかしい挙動について何かご存知の方が居ましたら教えて頂けないでしょうか?
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- ORUKA1951
- ベストアンサー率45% (5062/11036)
そこに書かれているeditOuterSeal.doの36行目・・・
- ORUKA1951
- ベストアンサー率45% (5062/11036)
firebugだと、どのスタイルシートによって上書きされているかがわかるはずですが??
お礼
ご回答ありがとうございます。 はい、Firebugの累積を使用してどのCSSのどういう値が設定されているかは確認しております。 結果、他のCSSの影響は受けておらず、borderの描画が崩れるdiv本体のCSS設定が適用されており、firebug上では1pxとなっております。 しかし、実際には1.11667pxで描画されているという状況です。
補足
firebug画面のスクリーンショットは以下のような感じです。 http://s3.gazo.cc/up/s3_13191.jpg あまりfirebugを使い慣れてないので、見方が間違っている可能性もありますが、borderの設定値(1px)と適用?値(1.11667px)と異なっています。
お礼
ご回答ありがとうございます。 >そこに書かれているeditOuterSeal.doの36行目・・・ そことは添付画像の事でしょうか? だとしたら86行目の書き間違え?という事で宜しいでしょうか? ちなみに86行目のCSS設定は以下の通りで、borderも1pxとなっております。 div.line1{ border:1px solid #DCDCDC; width:46px; height:38px; padding:0px; float:left; }