https://jsfiddle.net/2L9mznzu/
There are two empty text button, how to align them into a row?
.button {
display: inline-block;
width: 80px;
height: 30px;
line-height: 30px;
background: gray;
margin: 0 4px;
text-align: center;
}<div class="button">
</div>
<div class="button">Button
</div>
<div class="button">
</div>Use vertical-align: top property to your .button.
The vertical-align CSS property specifies the vertical alignment of an inline or table-cell box. Source: MDN
See demo below:
.button {
display: inline-block;
vertical-align: top;
width: 80px;
height: 30px;
line-height: 30px;
background: gray;
margin: 0 4px;
text-align: center;
}<div class="button">
</div>
<div class="button">Button
</div>
<div class="button">
</div>Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments