这种情况为什么只有一种居中

<html>
<head>
<style>
div{
position:absolute;
top:50%;
height:300px;
background:#ccc;
display:table-cell;
vertical-align:middle;

}

</style>
<title>text</title>
</head>
<body>
<div class="text">
s
</div>
</body>
</html>

_endid3758465

浏览 1282回答 3

3回答

blovetu

文字水平居中：text-align:center;单行文本垂直居中：line-height:盒子高度；多行文本垂直居中：1.使上下的padding值相同即可； 2.文字所在父级盒子display:table; 对文字设置display:table-cell;vertical-align:middle;（IE6不支持） 3.用定位去做块元素水平居中：margin:0 auto; 不知你指的是谁没居中

qq_夜深了飞_03660042

代码是从上到下执行的，position：absolute是作用于块状元素的，display：table-cell,破坏了div的块状性质，将其修改为了table-cell，这两处的代码是矛盾的，所以只有一种居中

随时随地看视频慕课网APP