DIV - 页面的确切中心

我需要将div完全放置在页面中间，并且宽度和高度未知。我可以用宽度居中，但是有可能使它与高度居中？DIV - 页面的确切中心

HTML：

<div class='lightbox'> 
    <div class='tc-content'>AAA</div> 
</div>

CSS

.lightbox { 
    position: fixed; 
    top: 0px; 
    left: 0px; 
    width: 100%; 
    height: 100%; 
    background: #000; 
    text-align: center; 
} 

.tc-content { 
    display: inline-block; 
}

来源

2014-12-03 FirstLegion

参见http://stackoverflow.com/questions/5481821/image-center-align-vertically-and-horizontally – Phrogz 2014-12-03 03:24:40

很多时候，我用这个水平居中的div和垂直

.lightbox { 
    position: absolute; 
    margin: auto; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    /* Other code here */ 
}

来源

2014-12-03 03:11:19 michaelpri

使用这种风格的TC-内容

.tc-content { 
    position: relative; 
    top: calc(50% - 1em); 
}

这里是一个工作Fiddle

来源

2014-12-03 03:13:51 VSri58

DIV - 页面的确切中心

回答

相关问题