我不能說爲什麼我的div容器有這麼多空缺

正如你所看到的，我已經爲div設置了邊框，我遇到的問題是容器div太大了，當我試圖減少它寬度裏面的divs弄得一團糟，因爲它們垂直對齊......你能說出這裏的問題是什麼嗎？我認爲這裏的內容是「包裝」的內容是錯誤的，但我不知道什麼是錯的。我不能說爲什麼我的div容器有這麼多空缺

enter image description here

正如你可以看到，如果我在放大頂部擴展標誌格但爲什麼不將內容DIV擴大呢？

enter image description here

這裏是CSS代碼：http://codepad.org/OhItDeVq

最後，相關的HTML代碼：http://codepad.org/RsOOgbGI

來源

2011-09-02 Bulvak

在此處發佈代碼，這就是爲什麼我們在SO上有代碼格式。 – Jakub

他的代碼太大了。 –

也許你需要你的包裝要寬一點，因爲它是小地方菜單DIV和內容。從第二張截圖中可以看到。

也許你需要的東西是這樣的：

CSS

.wrapper { width: 980px; position:relative; margin:0 auto; } 
.header { background:red; clear:both; height:100px; } 
.menu { width:160px; background:#ccc; float:left; height:300px; } 
.content { margin-left:160px; height:400px; background:green; }

HTML

<div class="wrapper"> 
    <div class="header"></div> 
    <div class="menu"></div> 
    <div class="content"></div> 
</div>

來源

2011-09-02 19:37:38 Samich

你說的不完全是真的，包裝不是很小，我解決了問題和部分解決方案的幫助，而不是自動寬度，我做了一個固定的寬度，這使得所有的鍛鍊:)非常感謝。 – Bulvak

我認爲它可能是與你的表。我強烈建議刪除它並堅持純粹的<div>佈局。然而，如果您必須使用該表格，那麼可以在其中放置一個cellspacing="0" cellpadding="0"。

來源

2011-09-02 19:38:33 KyleP

它看起來像你的div容器設置爲：

width: 79%

的div容器內部的某些元素的100％設定，使他們最終會被更廣泛那麼這就是爲什麼你看到的額外空間的容器。

我會建議保持容器div爲固定的像素寬度，然後使用內部元素的固定寬度或百分比寬度。這樣他們將基於容器的固定寬度並始終適合其內部。

希望有所幫助。

來源

2011-09-02 19:38:59 dSquared

我認爲，如果我設置容器內的元素的寬度爲100％，它只將元素的寬度設置爲父容器的100％。 – Bulvak

我同意這一個人。但似乎你正在使用另一個時代的HTML。

對於數據表示來說，表格是邪惡的。

這不應該用於設計目的。

我強烈建議您學習css的基礎知識，然後嘗試使用類似http://960.gs或http://cssgrid.net/的框架，這兩個框架都非常適合靜態或流體佈局。

但是再次嘗試讓你的標記儘可能輕！

來源

2011-09-02 19:42:07

我不能說爲什麼我的div容器有這麼多空缺

回答

相關問題