当前位置：首页 → 问答吧 → 有宽度，但高度不固定，怎么垂直居中？

有宽度，但高度不固定，怎么垂直居中？

时间：2010-09-08

来源：互联网

除了在外边套一个宽高100%的表格，然后将TD设成middle之外，还有其他的好办法吗？

作者: wouivkyi 发布时间: 2010-09-08

<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="author" content="庞淦"> <meta name="keywords" content="关键字"> <meta name="description" content="网站描述"> <meta name="robots" content="all" /> <title>深圳市天络科技有限公司</title> <style type="text/css"> .box {display:table-cell;vertical-align:middle;text-align:center;width:400px;height:400px;border: 1px solid #eee;position:relative;} .ad{*position:absolute;*top:50%;*left:50%} .ad1{*position:relative;*top:-50%;*left:-50%;height:190px;width:200px;margin:0 auto;border:1px solid red;overflow:hidden} </style> </head> <body> <div class="box"><div class="ad"><div class="ad1">可自适应高度</div></div></div> </body> </html>
提示：您可以先修改部分代码再运行

作者: radom 发布时间: 2010-09-08

2楼的，你这个还是定义了高度啊，ad1里放内容，但ad1设定了高度为190px

我说的是不设定高度

作者: wouivkyi 发布时间: 2010-09-09

body里放一个DIV，DIV里的内容或多或少，因此高度无法固定，但宽度是固定的，此时要让该DIV永远在页面的最中间，水平居中简单，垂直居中呢？

作者: wouivkyi 发布时间: 2010-09-09