Question

调整浏览器大小时，我注意到所有元素都不合适，网站布局也会失真。这也是在低分辨率下发生的。

这是因为我使用了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;
}

Answer 1

如果没有看到你的html代码，但在外部容器上使用css样式“min-width”（可能是哪个元素）应该可以解决问题，这是不可能的。

Answer 2

这通常只发生在float s。在任何方面你想要做的是创建一个你想要的宽度的包装div，然后设置溢出滚动：

HTML：

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

CSS：

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

调整浏览器大小时的CSS位置

2 个答案: