<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> div中的内容垂直居中实例 </title> <meta name="generator" content="editplus" /> <meta name="author" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <style type="text/css"> div.demo{width: 240px;margin: 12px auto;border: 1px solid #1987df;color: inherit;background: #CEE7FF} div#outerbox{height: 70px;position: relative;display:table} div#outerbox div{position: absolute;top: 50%;left: 0} div#outerbox p{position: relative;top: -50%;margin: 4px;text-indent: 0; font-size:14px;} div#outerbox>div{display:table-cell;vertical-align:middle;position:static} </style> </head> <body> <div class="demo" id="outerbox"> <div> <p> 对于div中文字可以使其垂直居中,我要兼容IE和firefox! </p> </div> </div> </body> </html>
div中的内容垂直居中实例
原创
©著作权归作者所有:来自51CTO博客作者追求完美2012的原创作品,请联系作者获取转载授权,否则将追究法律责任
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
DIV水平垂直居中
div水平垂直居中
css 水平垂直居中 宽高 html css3 -
div垂直居中
上下垂直居中 在线演示 DIVCSS5DIV水平居中和上下垂直居中DIVCSS5
css html 垂直居中 -
div垂直居中 css div盒子上下垂直居中
div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居
垂直居中 css html 绝对定位 实例代码