我不明白爲什麼是空的div移動div的內容。 爲什麼空div移動div的內容?
div {
width: 100px;
height: 100px;
background-color: red;
border: 2px solid #000;
display: inline-block;
}
<div>a</div>
<div></div>
我不明白爲什麼是空的div移動div的內容。 爲什麼空div移動div的內容?
div {
width: 100px;
height: 100px;
background-color: red;
border: 2px solid #000;
display: inline-block;
}
<div>a</div>
<div></div>
您需要添加vertical-align
對他們說:
div {
width: 100px;
height: 100px;
background-color: red;
border: 2px solid #000;
display: inline-block;
vertical-align:top; /* <-- SEE THIS? */
}
<div>a</div>
<div></div>
哦,你在問題關閉後回答了問題。做得好。有一個upvote。 –
@MrLister - 感謝您對我垃圾郵件的滿意。 – vsync
改變風格
div {
width: 100px;
height: 100px;
background-color: red;
border: 2px solid #000;
float:left;
margin:0 2px;
}
https://jsfiddle.net/anwnacc2/
請日的jsfiddle
div { width:100px; height:100px; background-color:red; border:2px solid#000; float:left; margin:0 2px; } 使用這種風格它會使div並排 –
空的div難以確定其基線的位置。解決方案:通過設置vertical-align屬性將它們對齊。 –