Question

我有一个position: fixed;的div，其高度根据浏览器窗口的高度而变化。我想在div中水平居中文本。我怎样才能用CSS完成这个？（另外，我想让IE8兼容。）

#fixed_div{
    position: fixed;    
    top: 40px; 
    bottom: 40px;
    right: 0px;
    width: 40px;
}

#text_span{
    /* ??? */
}

Answer 1

顶部：50％的技巧不准确，因为它会低一些，有几个技巧：

跨度位置是绝对的，顶部是50％和边距顶部 - ＆gt; -50％的跨度高度（可以尝试使用％，最好是跨度的高度，如果已知的话）。

#text_span {
    position: absolute;
    top: 50%;
    margin-top: -50%; //or pixels (according to Mr. Green it has to be pixels)
    width: 100%;
    text-align: center;
}

用包含display：table的div包裹span，并显示span：table-cell

#wrapper-div {
    display: table;
    height: 100%;
}
#text_span {
   display: table-cell;
   width: 100%;
   vertical-align: middle;
}

表方法的工作小提琴:(它不能直接对固定元素起作用，你必须在里面添加另一个元素）http://jsfiddle.net/a4ndeza5/1/

希望这有帮助。

如何在固定位置div中垂直居中文本范围？

1 个答案: