如何在twitter bootstrap css的网格中对齐文本/图像/链接？

发布时间：2020-12-18 00:20:20 所属栏目：安全来源：网络整理

导读：我试图使用Twitter的bootstrap CSS框架,到目前为止只有网格布局. 现在我只想对齐每个网格单元格的内容 div至底部. 我显然没有CSS buff. 这是html： div class="container" div class="row" div class="span4" a href="index.php"img src="someprettyhighimag

我试图使用Twitter的bootstrap CSS框架,到目前为止只有网格布局.
现在我只想对齐每个网格单元格的内容< div>至底部.
我显然没有CSS buff.

这是html：

<div class="container">
    <div class="row">
        <div class="span4">
            <a href="index.php"><img src="someprettyhighimage.gif"/></a>
        </div>
            <div class="span8">
                some text/links that need to be bottom aligned
            </div>
        </div
    </div>
</div>

我找不到制作第二列的方法< div>文本(和/或第一个)是底部对齐的.

有人知道我需要的css魔法吗？
(或者我也将如何使< div>底部对齐？

非常感谢,

塞巴斯蒂安

解决方法

您需要将class =“row”div的position属性设置为relative,然后将包含text的div的position属性设置为absolute,将bottom属性设置为0.

.row { position: relative; }
.span8 { position: absolute; bottom: 0; }

在jsfiddle上查看：

http://jsfiddle.net/A8XE2/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!