首页 > 代码库 > 让DIV标签中的P标签水平和垂直都居中

让DIV标签中的P标签水平和垂直都居中

http://blog.csdn.net/yaoyyl/article/details/50548589

 

  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8" />  
  5. <title>让DIV标签中的P标签水平和垂直都居中</title>  
  6. <style type="text/css">  
  7. div {  
  8.   width:400px;  
  9.   height:300px;  
  10.   border:1px solid #666;  
  11.   overflow:hidden;  
  12.   position:relative;  
  13.   display:table-cell;  
  14.   text-align:center;  
  15.   vertical-align:middle;  
  16. }  
  17. p {  
  18.   border:1px solid #333;  
  19.   width:100%;  
  20.   }  
  21. * { margin:0; padding:0;}  
  22. </style>  
  23. </head>  
  24. <body>  
  25.    
  26. <div>  
  27. <p>我是多行文本,我要水平和垂直都居中。</p>  
  28. <p>且要完全兼容ff和ie。我是多行文本,我要水平和垂直都居中。且要完全兼容ff和ie。</p>  
  29. </div>  
  30.    
  31. </body>  
  32. </html>  

让DIV标签中的P标签水平和垂直都居中