一个div中的padding会影响其他div [英] padding in one div affects other divs

问题描述

我有三个 inline-block divs：

<div style="display:inline-block">div1</div>
<div style="display:inline-block; padding-top:5px">div2</div>
<div style="display:inline-block">div3</div>

我添加了一个填充到第二个div，显示它一点，但这使得其他divs也下去。

I added a padding to the second div to display it a little lower, but this makes others divs to go down as well. How to make only the second div to display lower?

这里是一个JSFiddle： http://jsfiddle.net/mY6hP/

Here is a JSFiddle: http://jsfiddle.net/mY6hP/

同样的问题这里，但接受的答案建议使用 absolute 定位

The same thing was asked here, but the accepted answer suggests using absolute positioning, which i would not like to do.

推荐答案

更改其他div上的对齐方式，使它们自己在顶部 vertical-align：top; ）：

Change the alignment on the other divs so they allign themselves at the top (via vertical-align:top;):

<div style="display:inline-block; vertical-align:top;">div1</div>
<div style="display:inline-block; padding-top:5px">div2</div>
<div style="display:inline-block; vertical-align:top;">div3</div>

这篇关于一个div中的padding会影响其他div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！