<分区>
<分区>
我在 safari 上遇到这种奇怪的行为,但在 chrome 或 firefox 上不会发生。我有一个带有相同大小的框(内联 block )的布局。框内有文本,在带有“溢出:隐藏;”的 div 内。在 chrome 和 firefox 上,框完全对齐,但在 safari 上,如果文本超过一行,框会“向上移动”,从而弄乱对齐。任何有助于理解和纠正这一点的帮助将不胜感激。谢谢。
CSS:
.pb {
background: #ddd;
display: inline-block;
margin: 4px;
padding: 16px;
}
.pb .dt {
width: 100px;
}
.pb .qt {
height: 15px;
overflow: hidden;
}
HTML(每个框):
<div class="pb">
<div class="dt">
<div class="qt"><span>TEXT HERE</span>
</div>
</div>
</div>
最佳答案
您需要设置vertical-align
属性:
.pb {
background: #ddd;
display: inline-block;
margin: 4px;
padding: 16px;
vertical-align:top;
}
关于html - 跨浏览器内联 block 对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18705451/