ie6 positionとfloatのバグ

2011/01/20

調べると有名?
原因はよくわかんない…原因はie6のバグ。

私の場合は下記のような感じで「position:absolute;」の箇所が消える。

  1. <div style=”position:relative;top:0;left:0;”>
  2.  <div style=”position:absolute;top:0;left:0;”>ああ</div>
  3.  <div style=”float:left;width:100px;”>いい</div>
  4.  <div style=”float:left;width:100px;”>うう</div>
  5. </div>

「position:absolute;」のあとに空のタグをかませればいいと言うことでやってみた。
IE6でposition:absoluteしたボックスが消えるバグ」を参考。

  1. <div style=”position:relative;top:0;left:0;”>
  2.  <div style=”position:absolute;top:0;left:0;”>ああ</div>
  3.  <div></div>
  4.  <div style=”float:left;width:100px;”>いい</div>
  5.  <div style=”float:left;width:100px;”>うう</div>
  6. </div>

これはちょっとイヤ。だから少しアレンジしてみた。

  1. <div style=”position:relative;top:0;left:0;”>
  2.  <div style=”position:absolute;top:0;left:0;”>ああ</div>
  3.  <div>
  4.   <div style=”float:left;width:100px;”>いい</div>
  5.   <div style=”float:left;width:100px;”>うう</div>
  6.  </div>
  7. </div>

まだ、こっちの方がいい。

詳しく知りたければWin/IEで絶対配置(position: absolute)のボックスが消えるバグの検証ページ

新着(ニュース関連以外)

2017-08-03
formのinputでmaxlengthを使うとFirefoxでバグってた。他のブラウザでも気づかずにバグってたかもしれない。
2017-07-19
折れ線グラフをもう少しゆるやかに・・・というか何というか・・・調べていくと「移動平均」っていう言葉にたどり着いた
2017-07-10
FuelPHPの1.8をダウンロードして使っていたらセッションが使えないということに気付いた。
2017-06-27
MACにWin10をインストールしてみた:再挑戦。
2017-06-25
「簡単」っていうヤツらが多いけど・・・難しいぞ。