如何在中间垂直制作我的div？

Question

  

可能重复：
  Method for full-screen vertically-centered HTML page?

请告诉我如何让我的div垂直显示在页面中间。

Answer 1

你可以试试这个。

在你的HTML中：

<div id="tbl">
 <div id="tbl_cell">
   <div id="content"></div>
 </div>
</div>

在你的css中：

html, body, #tbl {
 margin: 0;
 padding: 0;
 height: 100%;
 width: 100%;
}

#tbl {
 display: table;
}

#tbl_cell {
 display: table-cell;
 margin: 0;
 padding: 0;

 text-align: center;
 vertical-align: middle;
}

#content {
 border: 1px solid red;
 background-color: #000;
 width: 100px;
 height: 100px;
 margin: auto;
}