如何在一个更大的div中垂直和水平居中一个div？ [英] How can I vertically and horizontally center a div within a larger div?
本文介绍了如何在一个更大的div中垂直和水平居中一个div？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在div中水平居中一个div 我设法水平居中造型从接受的答案。我如何还可以垂直居中？内部div的高度未知。
Horizontally center a div in a div I managed to center horizontally using styling from the accepted answer. How can I also center it vertically? The inner div is of an unknown height.
推荐答案
From： http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Universal vertical center with CSS</title>
<style>
.greenBorder {border: 1px solid green;} /* just borders to see it */
</style>
</head>
<body>
<div class="greenBorder" style="display: table; height: 400px; #position: relative; overflow: hidden;">
<div style=" #position: absolute; #top: 50%;display: table-cell; vertical-align: middle;">
<div class="greenBorder" style=" #position: relative; #top: -50%">
any text<br>
any height<br>
any content, for example generated from DB<br>
everything is vertically centered
</div>
</div>
</div>
</body>
</html>
这篇关于如何在一个更大的div中垂直和水平居中一个div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
