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-06-27
MACにWin10をインストールしてみた:再挑戦。
2017-06-25
「簡単」っていうヤツらが多いけど・・・難しいぞ。
2017-06-06
FuelPHPのOILでtry・catchを使ったらエラーになった。
2017-04-11
動画をライトボックス風に表示したい・・・ライトボックス風って何? とりあえずbootstrapで対応したい。
2017-04-05
GitHubとかでzipをダウンロードすると・・・srcとdistと中身が似たようなのがよくあるので調べてみた。