2010-07-29 69 views

回答

1

Bordingo從得到的溶液中。

<html> 
<head> 
<style type="text/css"> 
html, body { height: 100%; min-width: 960px;} 

.container { width: 960px; height: 100%; margin: 0 auto; background: #ddd; } 

.nav-fix { position: absolute; left: 0; width: 50%; min-width: 480px; height: 100%;} 

.nav { position: absolute; top: 100px; right: 280px; width: 9999px; height: 200px; background: #333; } 

.nav-box { position: absolute; top: 10px; right: 10px; width: 180px; height: 180px; background: #eee; } 

</style> 
</head> 
<body> 
<div class="nav-fix"> 
<div class="nav"> 
<div class="nav-box"></div> 
</div> 
</div> 
<div class="container"></div> 
</body> 
</html> 
+0

雖然導航區域的動態高度沒有運氣? – 2010-08-03 13:14:43

+1

它們的動態高度似乎有效,高度只是在示例中保持形狀而不添加演示內容。 – Picard102 2010-08-03 15:57:44

0

如果您願意使用jQuery,您可以非常輕鬆地計算主體的偏移量並相應地調整邊欄的寬度/填充/邊距。

簡單實例

http://dl.dropbox.com/u/1588084/floatmenu.htm

+0

兩個問題。它不會將內容區域和菜單區域置於居中位置。另一個是內容區域在較小尺寸的菜單下滑動。 我在這裏試過了。 http://dl.dropbox.com/u/23132/New%20Folder/index2.html – Picard102 2010-07-30 02:48:17

+0

這是相同的技術,但我認爲,我已經將它改變爲更接近您的樣機。保持菜單和內容居中,沒有滑動。 http://dl.dropbox.com/u/1588084/floatmenu_2.htm – 2010-07-30 14:31:26

+0

仍然不能正常工作。菜單和邊欄應處於固定位置,當我嘗試使用您的版本進行操作時,它會分崩離析。菜單和流體部分也將會有內容變化,因此它們需要動態地保持相同的高度。 – Picard102 2010-07-30 18:55:50