调整窗口大小时停止元素移动

Question

我为我的页面构建了一个标题栏.它由元素组成,里面是一些元素,.我可以很好地放置所有东西但是当我调整浏览器窗口大小时,一切都开始移动并在标题中重叠.给标题,甚至身体一个固定的像"宽度:1000px"解决这个问题,但这取决于屏幕大小.

我如何让我的页面使得任何调整浏览器窗口的大小都会导致滚动条出现以查看隐藏的内容,以及这将不依赖于硬连线分辨率(以像素为单位).

Answer 1

给你的主要div(通常是你的包裹div)a min-width: ...px.

像这样:

<div class="wrap">
    <div class="header">...</div>
    <div class="content">...</div>
</div>

.wrap {
     width: 95%;
     min-width: 900px;
}

在上面的示例中,包装器div总是至少为900px.当窗口调整为较小的宽度时,将出现滚动条.

如果屏幕大于900px,则div的宽度为95%.