css – 如何垂直对齐一个文本?

前端之家收集整理的这篇文章主要介绍了css – 如何垂直对齐一个文本?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何垂直对齐浮动的div中的文本?例如:我有一个固定高度的动态内容.如果内容小或大,则必须自动垂直对齐.

谢谢

解决方法

表格单元格是最简单的解决方案.

Javascript是一种替代方法(测量div的大小和文本大小,然后调整填充,或线性高度,或任何).

编辑:or this awesome css:

CSS

div#container {
    border: solid 1px;
    height: 300px;
}

div#content {
    border: solid 1px;
}

div#balance {
    border: solid 1px;
    /* gotta be 100% */
    height: 100%;
}

div.valign {
    /* firefox 2 */
    display: -moz-inline-Box;
    /* everybody else */
    display: inline-block;

    vertical-align: middle;
}

/* IE 6 and 7 hack */
html* div.valign {
    display: inline;
}

HTML

<div id="container">
    <div id="balance" class="valign"></div>
    <div id="content" class="valign">
        Blah blah blah blah<br/>
        Blah blah blah blah<br/>
        Blah blah blah blah<br/>
        Blah blah blah blah<br/>
        Blah blah blah blah
    </div>
</div>

做一个博客文章的意思有一段时间,我认为是时候了.

原文链接:https://www.f2er.com/css/216901.html

猜你在找的CSS相关文章