欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

CSS DIV 垂直居中

程序员文章站 2022-04-24 16:49:53
...
<html>
<head>
<style>  
body {padding: 0; margin: 0;}  
body,html{height: 100%;}  
#outer {height: 100%; overflow: hidden; position: relative;width: 100%; background:#333;}  
#outer[id] {display: table; position: static;}  
#middle {position: absolute; top: 50%;left: 0}  
#middle[id] {display: table-cell; vertical-align: middle; position: static;}  
#inner {position: relative; top: -50%; margin: 0 auto;}  
#content{width:500px; height:400px; border:1px solid red; background:#EEE; margin: 0 auto;}  
</style>
</head>
<body>  
<div id="outer">  
    <div id="middle">  
        <div id="inner">  
             <div id="content">111</div>  
        </div>  
    </div>  
</div>  
</body>
</html>
相关标签： CSS HTML

上一篇： 国内常用的NTP服务器

下一篇： linux服务器时间不同步解决方法

推荐阅读