溢出的問題

我正在一個HTML/CSS網站上，主要是4個div（包裝，頂部，菜單和內容），使用居中佈局。溢出的問題

問題是，我的＃內容中的文本重疊，我不能強迫它在div內。另外，當我啓用div上的滾動並在HTML上禁用它時，滾動只會對div無效。因此，我遇到了重疊的內容，無法向下滾動。

所以，恢復它，我想使用3固定的div，居中，留下兩個邊框，並希望我的背景圖像不移動。只有內容應該在內部滾動。

這裏是我的CSS代碼：

<style type=text/css> 

html 
{ 
    overflow: none; 
} 

head 
{ 

} 

body 
{ 
    background-color: #030B12; 
} 

p 
{ 
    font-family: verdana; 
    font-size: 12px; 
    color: #FFFFFF; 
    text-align: left; 
} 

h1 
{ 
    margin-top: 25px; 
    font-family: verdana; 
    font-size: 16px; 
    color: #FFFFFF; 
    text-align: center; 
} 

bg2 
{ 
    position: fixed; 
    top: 0; 
    left: 0; 
} 

#wrapper 
{ 
    height: 100%; 
    width: 70%; 
    margin: auto; 
    background-image: url('bg2.jpg'); 
    background-position: fixed; 
    background-repeat: no-repeat; 
} 

#top 
{ 
    background-image:url('top.jpg'); 
    background-repeat: no-repeat; 
    background-position: fixed; 
    height: 15%; 
    width: 100%; 
    margin: auto; 
} 

#menu 
{ 
    height: 60px; 
    width: 100%; 
    background-image: url('navi_bg.png'); 
} 

#content 
{ 
    overflow: auto; 
    display: block; 
} 

ul 
{ 
    list-style-type: none; 
    height: 60px; 
    width: 663px; 
    margin: auto; 
} 

ul a 
{ 
    background-image: url(navi_bg_divider.png); 
    background-repeat: no-repeat; 
    background-position: right; 
    padding-right: 22px; 
    padding-left: 16px; 
    display: block; 
    line-height: 60px; 
    text-decoration: none; 
    font-family: Georgia, "Times New Roman", Times, serif; 
    font-size: 21px; 
    color: #FFFFFF; 
} 

ul li 
{ 
    list-style-type: none; 
    float: left; 

} 

ul a:hover 
{ 
    color: #3F5F7B; 
}

來源

2012-11-20 RBorges77

郵政所有代碼。使用jsfiddle。 – twodayslate

你應該在http://jsfiddle.net/中設置它，因爲你的代碼太長了，你缺少html – Linas

基於什麼是可用的，我創建了一個佈局，我認爲是你在找什麼。獲得頂級菜單項目時有一些問題，但我相信你可以很容易地解決這個問題。如果您只想滾動該區域，則應指定內容區域的高度，並使包裝的背景保持靜態。

div#content{ 
max-height:300px; 
overflow-y:scroll; 
}

Here is the fiddle

來源

2012-11-20 17:08:05 TNCodeMonkey

回答

相關問題