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 - 頁面的確切中心

回答

相關問題