2012-07-30 33 views
0

我有我的問題的心臟這個簡單的CSS佈局:挑選出我飄來的div百分比寬度

enter image description here

的萊夫特賽德設置爲float:left70%的寬度,右邊設置爲float:right,寬度爲30%。 然而,這給我留下了一個缺口,他們不太喜歡摸我需要他們太:

enter image description here

爲了解決這個我可以改變的百分比,以70.1% and 30%.這意味着大部分的時間差距不見了但偶爾會將版權推到低於左邊的地方,這是不好的!

我試過rightside的寬度設置爲auto並再次向下推rightside但看起來像這樣:

enter image description here

然後我試圖在rightside擺脫了float:right的。幾乎工程除register_container一路下降至底部,即使div的其餘部分(也rightside內,但register_container後上市)坐在右邊,因爲他們應該: enter image description here

這裏的a paste of my css,這裏是我暫時上傳的網站:http://greenevent.site50.net/index.php

如果有人能幫助我解決我的問題,那將是太棒了! (如果不明確,我希望安排看起來像發佈的第一個網站圖像,但沒有細微的間隙)。

回答

2

將您的float: right;切換到您的正確容器上的float: left;。您還需要爲容器分配寬度。

Webkit瀏覽器中存在一個錯誤,這意味着您在有時可能會有點痛苦的時候不會獲得100%的回報。

http://jsfiddle.net/spacebeers/Lyphr/2/

如果您在Chrome的開發工具改變您的權利容器上的寬度,以27%你會得到你之後的佈局。

+0

哦,謝謝!但我認爲我的中央容器一定有問題,因爲當我改變它時,你建議所有東西都掉到左邊:http://i.imgur.com/vCksL.jpg – Holly 2012-07-30 16:26:50

+0

對不起,你必須給它指定一個寬度以及。這爲我解決了。 – SpaceBeers 2012-07-30 16:28:58

+0

啊對不起,我剛剛刷新我現在得到它!謝謝! – Holly 2012-07-30 16:29:26

1

你也可以嘗試浮動只在左側,並有右側保證金:

​#left 
{ 
    float: left; 
    width: 70%; 
    background: yellow; 
} 

#right 
{ 
    margin-left: 70%; 
    background: red; 
} 

http://jsfiddle.net/2z6KZ/