2012-07-26 137 views
0

我已經在我的佈局中採用了流體佈局,但遇到了一些困難,我想問一些問題。JavaScript流體佈局

現在的佈局是這樣的:

enter image description here

我想它看起來就像這樣:

enter image description here

,同時保留它的流動性。我該如何去實現這個目標?

我已上載這裏的代碼:http://jsfiddle.net/methuselah/V44Jw/3/

+0

可能是http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm可以幫助一下 – 2012-07-26 10:06:38

回答

1

這一切都可能與CSS和JavaScript的沒有在所有。您不應該使用JavaScript來創建流暢的佈局。

你已經用CSS做了一些很好的工作。一個簡單的方法是使用元素的絕對定位,相對大小。在每個div內與position: relative;你可以做你的意志絕對定位。

一個好的做法是將大小計算留給瀏覽器。如果你看看這個例子:

#someDiv { 
    position: absolute; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 80%; 
} 

這個div將有它的父元素的100%的高度,由於從頂部和底部偏移0。試着改善你的小提琴,它可能會解決你所有的問題。再次詢問你是否掙扎。