CSS/DHTMLバグ辞典スレッド ver2.0

このエントリーをはてなブックマークに追加
273Name_Not_Found
CSSで段組を作るには悩まされますよね。
左右二段、左段の幅のみ一定の段組にする場合でのバグ。
ソースは大略以下の通り。
<div id="navbar">〜</div>
<div id="base">
  <div class="head">
   <h1><img src="logo.gif" alt="title" width="450" height="300"></h1>
   <p class="rublic">〜前文〜</p>
  </div>
  <div class="main"><p>〜〜本文〜〜</div>
</div>
<div id="address">©氏名 <address>アドレス</address></div>

#navbar,#address{height:2.5em; background:black; color:white;}
#base {
 position:relative; /*#mainの基準に*/
 background:#efefef;
}
#head {
 width: 165px;
 position: absolute;
 left: 3px;
}
#main {
 margin-left: 170px;
 min-height: 450px; /*#headを#addressに被さらせないために*/
}

NN6.2やOpera6ではこれで問題なし。
これがWinIE5.5〜6で確認すると、div#headがなぜか
左端から右に170pxほどズレて、div#mainに重なって表示される。
どうやら#mainのmargin-leftを引き継いでしまってるらしい。
#headへの指定に“width:100%;"を追加するとこのバグは廻避された。
274273:01/12/24 21:44 ID:WtOxvadv
HTMLソースのclass="head"、class="main"は
正しくはid="head"、id="main"でした。失礼。