CSS 3浮動div - 左邊的中間彼此之間有空白

Question

我想讓3個浮動div - 左邊，中間和右邊以及它們之間的空格（邊距）。 例如：

div與245px寬度，6px空間，div與246px，6px空間，div與245px（總共748px）。

我發現它的方式是： 容器有748px，浮動的左div，絕對定位的div與margin:0 251px;（245 + 6）和浮動右div。

它的工作原理（但不是在IE6中），所以我想知道是否有其他方式沒有使用絕對位置。 我不想使用3浮動左邊的divs和中間的邊緣，因爲當你縮小結構不是全寬。 （因此，你必須使用1左浮動，1右浮動。）

希望你能理解並能提供幫助。

謝謝！

Answer 1

在你的網頁中使用這個東西 .mainDiv { width：748px; float：left;
} .leftDiv {float：left; width：245px; padding-right：6px;} .centerDiv {float：left; width：246px; padding-right：6px;} .rightDiv {float：right; width ：245px;}

使用這種stysheet烏拉圭回合格結構 鉻給類名作爲樣式表

Answer 2

使用CSS網格系統。

示例是http://cssgrid.net/或其他類似http://960.gs，Twitter Bootstrap，Blueprint CSS ..請選擇。舉例來說，Bootstrap支持固定寬度佈局和流體佈局。另一方面，當您重新調整瀏覽器窗口的大小時，CSSGrid可以很好地擴展。

您可以學習如何快速使用網格，它可以幫助您保持佈局清潔。