自動高度不延伸內容背景

我是新來編碼，並有一個小問題，我不明白。我定義了一個#wrapper div以允許將我的內容居中放在頁面上併爲背景白色（在css中定義的背景色）着色。每當我將height屬性設置爲auto時，我的頁面頂部會出現一個白色框，這似乎代表了我在#wrapper屬性中設置的填充定義。如果呈現的意思是所有內容都按預期顯示，則我的實際頁面高度正常，但使白色框延伸至頁面底部以便整個背景爲白色的唯一方法是輸入固定的高度值。這是我有：自動高度不延伸內容背景

#wrapper { 
    width: 940px; 
    height: auto; 


    /* border-top: 1px solid #000000; 
    border-right: 1px solid #000000; 
    border-bottom: 1px solid #000000; 
    border-left: 1px solid #000000; */ 

    margin-left: auto; 
    margin-right: auto; 
    margin-top: 10px; 
    margin-bottom: 10px; 

    padding-top: 10px; 
    padding-right: 20px; 
    padding-bottom: 10px; 
    padding-left: 20px; 

    position: relative  
}

任何幫助肯定會感激！

來源

2013-03-26 Michele Hermes

可能的重複[我的浮動元素如何不在他們的父母]（http://stackoverflow.com/questions/4631540/how-come-my-float-elements-arent-within-their-parent） – Quentin 2013-03-26 14:16:06

那麼，汽車意味着汽車 - 只有實際的內容需要它。 – CBroe 2013-03-26 14:16:24

你可以發佈你的html嗎？或者創建一個http://www.jsfiddle.net – Pete 2013-03-26 14:21:53

#wrapper {overflow: hidden}

#wrapper {overflow: auto}

來源

2013-03-26 14:19:17 isherwood

如果你想#wrapper指定div來向你需要提供一個明確的高度頁面的底部。 身高：自動將調整爲僅適合內容。如果#wrapper是你的主頁div的直接子節點或者只是在你的body下面，你可以將這個父元素（body或者某個div）設置爲100％或者靜態值，然後將你的#wrapper設置爲該值的一個百分比像...

我不主張內聯樣式！只是一個例子

<body style="height: 480px"> 
    <div id="wrapper" style="height: 95%"> 
     content! 
    </div> 
</body>

機構還可能是一個百分比，然後將調整到窗口高度，可能會奏效，但可能不是你想要的，只是另一種選擇。

來源

2013-03-26 14:24:40 Sarophym

自動高度不延伸內容背景

回答

相關問題