float の border 突き破り

2010年 05月 01日

    久しぶりにCSS弄ってて float で分けたボックスをボーダーで囲みたいなーなんて思って以下をやってみた。

    #header {
width:870px;
margin: 0 auto;
padding: 0;
border-style: solid;
border-color: #565656;
border-width: 1px 0;
}
#header div#feft {
width:270px;
float:left;
}
#header div#Right {
width:600px;
float:left;
}

    こうなっちゃうんですよ・・・

    あーもう、inline だっけか clear だっけか・・・悩めば悩むほどﾄﾞつぼにはまるので調べて見た・

    #header {
width:870px;
margin: 0 auto;
padding: 0;
border-style: solid;
border-color: #565656;
border-width: 1px 0;
overflow: hidden;
}
#header div#left {
width:270px;
float:left;
}
#header div#Right {
width:600px;
float:left;
}

    overflow: hidden;
    こいつ付けてあげればいいのかｗ
    うはは、なるほどねすっきりした。
    ヽ(´ー｀)ノ
    【参照】
    Archiva様


    web
    ★☆★☆★☆　ナウでヤングなレンタルサーバー！ロリポップ！　☆★☆★☆★
    月額１０５円～容量最大30ＧＢ！WordpressやMovable Typeの簡単インストール付★

    Post a Comment