CSS和位置有點問題

Question

，所以我有一個內容框，此菜單框..現在的菜單框移動，當你在正常的全尺寸瀏覽器，如果你改變瀏覽器的大小...

這裏是圖片： http://img12.imageshack.us/img12/827/whyw.png http://img12.imageshack.us/img12/827/whyw.png

我做錯了什麼？

這裏是我的代碼：

#menu { 
position: absolute; 
background: #FFF; 
text-decoration: none; 
border: 1px solid #000; 
color: #000; 
padding-left: 14px; 
padding-right: 14px; 
margin: 12px; 
} 

#content { 
margin: auto; 
width: 800px; 
border: 1px solid #000; 
padding: 10px; 
} 

Answer 1

如果要使用position:absolute，則必須將父項設置爲position:relative。 這是因爲position:absolute相對於所定位的最後一個父親而定位。 默認情況下，它是您的身體元素。這意味着你的塊將被設置爲相對於身體，這就是爲什麼當你調整瀏覽器的大小時，你的塊被移開是最初的位置。

如果你將父母設置爲position:relative，你的塊將被設置爲相對於它。您只需設置頂部/底部和/或左/右座標。

像這樣的東西應該做的伎倆：

#menu { 
position: absolute; 
background: #FFF; 
text-decoration: none; 
border: 1px solid #000; 
color: #000; 
padding-left: 14px; 
padding-right: 14px; 
margin: 12px; 
top: 50px; 
right: -10px; 
} 

#content { 
margin: auto; 
width: 800px; 
border: 1px solid #000; 
padding: 10px; 
position: relative; 
} 

Answer 2

你可能想看看絕對定位與相對的。絕對值會告訴瀏覽器，無論窗口大小如何，某個項目都會顯示在同一個地點。我認爲這是造成你的問題的原因。

看看這裏的更多詳細信息：

http://webdesign.about.com/od/advancedcss/a/aa061307.htm

希望這有助於！