未知宽高div如何在页面内水平垂直居中
2016-01-07 本文已影响445人
郑伟的菜园子
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>moyu-edu.com</title>
<style>
*{
margin: 0;
padding: 0;
}
body,html{
height: 100%;
}
body{
text-align: center;
}
span{
display: inline-block;
height: 100%;
vertical-align: middle;
}
div{
width: 400px;
border: solid 1px red;
vertical-align: middle;
display: inline-block;
*display: inline;
*zoom:1;
text-align: left;
}
</style>
</head>
<body>
<span></span><div class="box">测试文字<br>asdfasdf<br>asdafasdfsdafadsf</div>
</body>
</html>
兼容所有的浏览器
