2013-05-04 67 views
0

我中心这种绝对的div:在窗口模式下居中绝对位置div?

<div style=" 
width:800px; 
height:190px; 
position:absolute; 
left:50%; 
margin-left:-400px; 
border-width:10px; 
border-style:solid;"> 
</div> 

在最大化模式,它正常工作。但是,当浏览器的宽度小于div时,我无法滚动到div的左侧,它被切断。我在Chrome和IE9上进行了测试

如何在窗口模式下居中绝对div?这是不符合的原因是什么?

回答

1

你可能会想改变div的宽度和高度,以百分比值,然后以它为中心,只是做这样的事情:

top:0; 
left:0; 
right:0; 
bottom:0; 
margin:auto; 
position:absolute; 
+0

当浏览器的宽度比格小,底部有一个滚动条。但我不能滚动到div的左侧,它被切断了,我不知道为什么 – user2174870 2013-05-04 20:34:56

+0

这是因为你的'div'设置为'position:absolute;'它将垂直位置设置在其他所有位置之上,包括' '。这意味着'div'不会拉伸'html'元素,所以浏览器不知道它需要向左滚动。 – 2013-05-04 20:38:00

+0

也许你需要的是将'div'的宽度设置为'width:70%;'而不是'width:800px;',以便根据窗口改变其宽度。 – 2013-05-04 20:39:23