2012-11-05 40 views
0

我有3divs左,中心,右 問題是左邊需要320px,右邊150px和中心將採取其餘的空間。 我該怎麼做?它需要100%的迴應。我不知道屏幕有多大,它可以從1920到1600屏幕分辨率不同,但左側和右側需要修復。響應設計爲3divs,2 div的寬度在PX和其他在「%」

已在評論中發佈的示例有效,但如果要在寬度爲最大768的情況下製作2列,並使用display:none隱藏3d div;它不會與表格示例一起使用。而另一個與css3框不工作,因爲它不工作在資源管理器,沒有pollyfill。

那麼,有沒有這方面的任何修補程序或做我需要做的是經典的方式和邊距和填充等補償.......

回答

0

您可以顯示:表屬性用於此。像這樣寫。

.parent{ 
    display:table; 
    width:100%; 
} 
.parent > div{ 
    display:table-cell; 
    min-height:200px; 
} 
.left{ 
    width:320px; 
    background:green; 
} 
.center{ 
    background:red; 
} 
.right{ 
    width:150px; 
    background:yellow; 
} 

入住這http://jsfiddle.net/BNQfC/1/

OR

您可以使用CSS3 柔性盒財產。

檢查這個http://jsfiddle.net/sjYNy/1/

+0

這是哪裏響應? – defau1t

+0

謝謝,這將解決問題。 – rubin

+0

@ defau1t你可以使用**媒體查詢**爲這個http://css-tricks.com/css-media-queries/。 – sandeep

相關問題