一个未知高度垂直居中的简单方法

最近在看飘舞零零的blog,有感而写。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{
            border-radius: 5px;
        }
        .wrap{
            overflow: hidden;/*很重要不不能少*/
            width: 800px;
            margin: auto;
            background: silver;
        }
        .center-box{
            margin:20px;
            padding:120px 0;/*有了这个才能撑开高度*/
            background: beige;
            text-indent:2em ;
            text-align: left;
        }
    </style>
</head>
<body>
     <div class="wrap">
             <p class="center-box">我是小白兔爱吃大萝卜我是小白兔爱吃大萝卜我是小白兔爱吃大萝卜我是小白兔爱吃大萝卜我是小白兔爱吃大萝卜我是小白兔爱吃大萝卜</p>
     </div>
</body>
</html>

 

posted on 2014-04-11 17:42  就让往事都随风  阅读(228)  评论(0编辑  收藏  举报