2010年05月18日

css:divの子ノードがdivに囲まれない

divの子ノードにcssでfloatが指定されていると、何故かdivの高さが無くなり子ノードが囲まれなくなる。

対処としては親ノードのdivにもfloatを指定する。

<div id="ddd" style="border: solid 1px red;"><span id="sss">あいうえお</span></div>
<script>
var d=document.getElementById("ddd");
var s=document.getElementById("sss");
alert("height="+d.offsetHeight);
if (typeof(s.style.styleFloat)=="undefined") {
s.style.cssFloat="right";
} else {
s.style.styleFloat="right";
}
alert("height="+d.offsetHeight);

if (typeof(d.style.styleFloat)=="undefined") {
d.style.cssFloat="left";
} else {
d.style.styleFloat="left";
}
// FireFox, Chrome は↓が無いと幅がspanの幅と同じになる
d.style.width="100%";
alert("height="+d.offsetHeight);


posted by 忘却の達人 at 22:21| Comment(0) | TrackBack(0) | その他 | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。