将文字对齐的顶部
问题描述:
大家好我的页面在这里:http://www.gamingonlinux.com/sales/我想在添加,价格,储蓄和提供商的顶部对齐文本,我会怎么去呢?将文字对齐的顶部
下面是列在html:
<div class="row">
<div class="left">
{:screenshot} {:info}
</div>
<div class="date-column">
{:date}
</div>
<div class="price-column">
{:price}
</div>
<div class="middle">
{:savings}
</div>
<div class="right">
{:provider}
</div>
</div>
而且他们的CSS:
.left
{
display: table-cell;
padding: 14px;
}
.price-column
{
display: table-cell;
padding: 14px;
width: 150px;
}
.date-column
{
display: table-cell;
padding: 14px;
width: 150px;
}
.middle
{
display: table-cell;
width: 75px;
padding: 14px;
}
.right
{
display: table-cell;
width: 155px;
padding: 14px;
}
“左”分区的截图并命名在里面飘来左右的跨度。
答
就像在常规表单元格上一样,您可以使用vertical-align:top;
来进行对齐。
答
简单的解决办法:
.row > div {
vertical-align: top;
}
答
如果我理解你的问题试试这个代码。 vertical-align
是不错的选择:
display: table-cell;
padding: 10px;
width: 150px;
text-align: center;
vertical-align: top;
更多其他选项vertical-align
是:
答
你只需要添加浮动:左;到你的css(.left类)这样的
.left
{
display: table-cell;
padding: 14px;
float: left;
}
哦,看起来很不错,谢谢! – NaughtySquid 2013-04-08 21:01:14
不客气。如果此答案解决了问题,请将问题标记为已回答。 – Bart 2013-04-08 21:04:52