2012-12-10 96 views
0

我有一個網站有兩個側邊欄和中間的內容。在HTML中它的定位如下:CSS模擬元素移動?

sidebar 1 - floated left 
middle content - floated left 
sidebar 2 - floated right 

而這也是它在網站上的樣子。都好。問題是我試圖讓網站響應,我想要的內容是在頂部和側邊欄跳下,我不完全確定如何做到這一點。我可以使用JavaScript,但如果可能的話,我會更喜歡CSS來做到這一點。

這裏是我的工作,如果有幫助的網站:

http://goo.gl/Q8J6v

壓住窗口降一點,看左側邊欄出現在上面的內容 - 並不好。

可能嗎?

回答

0

重新排列你的div,使body body div是第一位。 然後將第一個側邊欄和正文內容包裹在一個將正文內容向右側移動的div中。使用媒體查詢,以便一旦你的手機尺寸縮小,你可以將浮動設置爲無。

<div float:left> 
    <main-content float:right> 
    <sidebar float:left> 
<\div> 
<sidebar float:right>