Re: [問題] 網頁div高度設定

[adamp3 (Boston's 10th Man.)]

試試看clearfix這玩意吧!

//for IE
.clearfix {zoom:1;}
//for non-IE
.clearfix:after
{content:'.';display:block;visibility:hidden;clear:both;height:0px;}


加在你包住float物件的<div>的class裡面吧

ex.

        <div class="container clearfix">
                <div class="i-am-floating">
                   I think life is floating.
                </div>
        </div>

==
        .container{border:#000000 1px solid;}
        .i-am-floating{float:left:height:100px;border:#FF0000 1px solid;}


這樣container就會被撐開了!

可以拿掉clearfix試看看


※ 引述《abhouse24 (ab)》之銘言：
: 我與爬文中製作的div概念相同，
: 然而即使把nav與content以container包起來後，
: 在firefox中仍會有content內容overflow的問題
: （IE 使用不會）
: 我是試過display與clear可是仍無法解決問題，不知道是不是語法沒有對症下藥的關係。
: 有人有解決overflow的經驗嗎？
: : ========================
: : header
: : ========================
: : nav || content
: : ========================
: : footer
: : 我總覺得這是一個CSS上的常見難題 orz
: : 原因是因為用純CSS沒有辦法像你所說的一樣「去抓別的box的height」
: : 所以用float的兩欄式排版並不好做到兩欄同高
: : 一個workaround是用一個box（<div id="container">）包住nav和content
: : 在這個box中放y軸repeat的背景，然後把背景的寬度設成和導覽列一樣
: : 這樣就勉強可以做到你想要的校果了

--
        ○-.∫
     ︻〔   我的二十歲/四十天美國自助旅行全記錄+球場觀察
     ║  》               睡過車站 機場 還有旅舍交誼廳
     ║                          八座城市 七場大聯盟球賽
                                        http://adamp3.myweb.hinet.net/ 

--
※ 發信站: 批踢踢實業坊(ptt.cc) 
◆ From: 118.168.30.223
推 abhouse24:請問div的class要怎麼加呢?我去程式碼只有看到
→ abhouse24:<div id="body_containter">...</div>
→ abhouse24:應該不是把id換成class吧?
→ adamp3:你就自己加上class="clearfix"就可以了...
推 abhouse24:請問是這樣嗎?
→ abhouse24:<div id="body_container" class="clearfix">
→ adamp3:是的
→ adamp3:(其實你可以自己試試看XD)
推 abhouse24:請問container內的物件有特別的屬性嗎?如一定要float or
→ abhouse24:fix...，因為在container加了clearfix仍然無法包住
推 abhouse24:哈哈哈 成功了!對不起 我忘記要先宣告class!
→ abhouse24: 超級感謝adamp3!!