css - 固定不同宽度和高度的页面中心的div

Question

我有一个 div，只有当用户点击类别列表中的链接时它才会出现，即

类别 1类别 2第 3 类

并使用 jquery $.ajax() 加载内容，因此 div 的宽度会根据返回的数据发生变化，不，我想将 div 置于页面中央...

Answer 1

如果你想把一个元素恰好放在浏览器的中心，将这些样式分配给该元素:

.box {
width: 200px;
height: 100px;
top: 50%;
left: 50%;
position: absolute;
margin: -50px 0 0 -100px;
}

这里我假设我的元素有 100 像素的高度和 200 像素的宽度，所以在空白处我把它放在实际大小的 1/2 处。这样，无论我的浏览器有多大，我的元素都恰好位于页面的中心。

这是在线 demo