爲什麼我的主要內容區域不會停在屏幕的邊緣？

在我的網站中，我試圖展示我想讓我的頁面有一個左側邊欄/菜單區域，其主要內容區域位於右側。我希望我的主要內容區域停在屏幕的右邊緣，所以我試圖給這個區域一個width: 100%，但這似乎並不正確。這似乎是寬度爲100％，但隨後右移（因此要關閉屏幕的一側。爲什麼我的主要內容區域不會停在屏幕的邊緣？

找到我怎樣才能做到這一點，以保持所有在頁面中的文字？

2011-08-01 KallDrexx

爲了您main-area，刪除width:100%和position:absolute，更換left:160px與margin-left:160px就大功告成了。

2011-08-01 23:14:58 Alohci

這大部分工作。唯一的問題是在Chrome中，它不會像在IE中那樣進入藍色區域的末端，所以它的右邊像素爲150左右。有任何想法嗎？ – KallDrexx

沒關係我的問題:)。非常感謝！ – KallDrexx

這是因爲#main-area被設置爲100％的寬度，這將是容器的100％（這是這種情況是body。因此，它將是100％的頁面寬度。但因爲你將它移動到左邊160px，它的實際位置是100％的身體+ 160px。

是不是流出需要流暢嗎？如果沒有，你可以設置像素的＃main-area的寬度。

2011-08-01 23:12:40

如果你重新加載頁面，我把它全部包裝在100％寬度的'page' div中，但＃＃主區域（它在＃頁面內）仍然在屏幕上 – KallDrexx

Alochci's瞭解它 - 你的'page' div仍然是身寬的100％，所以你絕對定位的div仍然是該div的100％，這是它的容器（'body'）的100％。 –

您可以嘗試使用main-area替換：width: 100%與right: 0px。

基本上，這表明框的右側應該是父級左側的0px。現在main-area仍然可以通過頁面寬度進行縮放。

2011-08-01 23:16:41 Veger

回答