Question

我想在页面底部放置一个div，并将其宽度设置为960px，在页面中央，左边框的最小值为170px。这是我的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
</head>
<style type="text/css">
body{width:100%;height:100%;}
*{padding:0;margin:0;}
#wrap{position:fixed;margin:0 auto;margin-left:170px;width:960px;overflow:auto;bottom:0;height:100px;}
</style>
<body>
<div id="wrap">
test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test&nbsp;test
</div>
</body>
</html>

但是当屏幕宽度为1024时，div#wrap没有滚动而右侧部分没有显示。我该如何解决？

Answer 1

我想我理解了这个问题，但我仍然不清楚你想要建立什么。

你应该改变

position : fixed;

为：

position : absolute;

这可以解决您的滚动问题。

。。

*注意：我也认为你可以删除

overflow: auto;

另外，改变：

body{ width:100%;height:100%; }

为：

html, body{ 
    width:100%; 
    min-height: 100%;
    height: auto !important;        
    height:100%; 
}

Answer 2

你的div被切断了，因为你已将它对齐到浏览器窗口的底部，然后添加了一个左边距，将div推到窗口外面。溢出对此没有帮助，因为它不是被推到div之外的内容，而是整个div本身。

如果您正在尝试创建一个停留在页面底部的页脚，请执行Julian建议并绝对定位您的div（但再次注意边距），并确保注意到位于abosulely div的div使用“position：relative”相对于下一个父项定位，或者，如果没有找到，则定位html元素。

css位置：固定溢出：auto

2 个答案: