4

すべての IE、Safari、および chrome が動作している間に、firefox で問題が発生しました。

<div class="forDiv">ddd</div>
<table class="forTable"> .... </table>


.forDiv {
width:100%;
border:3px solid #236FBD;
background-color: #236FBD;
}

.forTable{
width:100%;
border:3px solid #236FBD;
background-color: #236FBD;
}

firefox では、div は少し小さくなります。どうすれば修正できますか？

4

5 に答える 5

7 
.forDiv {
width:100%;
border:3px solid #236FBD;
background-color: #236FBD;
-moz-box-sizing: border-box;
}

.forTable{
width:100%;
border:3px solid #236FBD;
background-color: #236FBD;
-moz-box-sizing: border-box;
}
于 2009-08-27T05:58:29.633 に答える
4

これは、さまざまなブラウザが width 属性をどのように扱うか、つまり、幅にボーダー/パディングの寸法が含まれているかどうか、またはそれらを追加と見なすかどうかに一貫性がありません。

「border-box」に設定された -moz-box-sizing 属性を使用して、Mozilla ベースのブラウザーに、IE が quirks モードでそれを行う方法をエミュレートするように指示できます (詳細については、このページを参照してください)。

于 2009-08-27T06:07:27.090 に答える
3

overflow:hidden; を試してください。私も同じ問題を抱えていました。それから私はこれを手に入れました

リンク

それから私はソルンを得ました。divのoverflow:hiddenを作成すると、うまくいきました。

于 2010-03-19T05:32:18.067 に答える
2

ほとんどの場合、隣接する要素または要素を含む要素に設定されたマージンまたはパディングと関係があります。完全なコンテキストなしではわかりにくいですが、div と table のマージンとパディングの属性を設定して、何が起こるかを確認してください。

于 2009-08-27T06:07:28.633 に答える
2

わかりました、これは古典的な IE ボックス モデルの不一致のようです (または、バグと言いましょうか?)

これを回避する最も簡単な方法は、次のようにコンテナー div 内で div (ddd を含むもの) を定義することです。

<div id="container">
  <div class="forDiv">ddd</div>
</div>

CSS プロパティを次のように定義します。

#container
{
  width:100%;
}

.forDiv
{
  border: 3px solid;
}

これにより、IE と Gecko の両方で同じサイズになります。

于 2009-08-27T07:12:23.137 に答える