2011-11-27 71 views
0

調整瀏覽器大小時,我注意到所有元素不合適,網站佈局變形。這也發生在低分辨率上。調整瀏覽器大小時的css位置

這是因爲我用過position:relative;嗎?如何在調整大小時使頁面元素不會從其位置移動。

body{ 
    background:url(../img/bg-silver.jpg) #F2F2F2; 
    font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:11px; line-height:18px; color:#636363; 
    margin-top:10%; 
} 
#containerHolder { 
    background: #eee; 
    padding: 5px; 
    position:relative; 

} 


#container { 
    background: #fff; 
    background:rgba(245,245,245,0.8); 
    border: 1px solid #ddd; 
} 

#main { 

    margin: 0 0 0 20px; 
    padding: 0 19px 0 0; 
} 

回答

1

這通常只發生在float s。在你想要做的任何方面是創造你想要的寬度的包裝的div,然後只需設置溢出滾動:

HTML:

<body> 
    <div id="wrapper"> 
     <!-- content here --> 
    </div> 
</body> 

CSS:

#wrapper { 
    width:980px; 
    overflow-x:scroll; 
} 
1

這是不可能說沒有看到你的HTML代碼,但使用外部容器(可能是任何一個元素)的CSS樣式「最小寬度」應該解決的問題。

+0

似乎修復它 – user478636

相關問題