我正在使用 display: inline-block;
并排放置多个表单组,它适用于 Firefox,但不适用于 Chrome。
HTML:
<div class="form-group dis-inl-blc mar-l-20">
<div class="input-group">
<span class="input-group-addon">50x25cm :</span>
<span class="value">Black</span>
</div>
</div>
<div class="form-group dis-inl-blc mar-l-20">
<div class="input-group">
<span class="input-group-addon">50x40cm :</span>
<span class="value">Grey, White / Black / Gold, Bronze</span>
</div>
</div>
<div class="form-group dis-inl-blc mar-l-20">
<div class="input-group">
<span class="input-group-addon">50x50cm :</span>
<span class="value">Gold, Bronze</span>
</div>
</div>
CSS:
.dis-inl-blc {
display: inline-block;
vertical-align:top;
}
.value {
display:inline-block;
background-color: white;
border: 1px solid lightgrey;
height:30px;
padding: 4px 10px;
border-radius: 0 4px 4px 0;
}
.mar-l-20 {
margin-left: 20px;
}
JSfiddle:http://jsfiddle.net/8osL6xhf/
如何使这些倍数与 Chrome 并排形成组?
最佳答案
您好,请尝试将显示属性更改为内联表。
试试下面的代码。
CSS
.dis-inl-blc {
display: inline-table;
vertical-align:top;
}
希望这能奏效..
关于css - 与显示 : inline-block; working with Firefox not with Chrome 并排形成组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44476900/