0

次のような 3 つのinline-blockdiv があります。

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

少し下に表示するために 2 番目の div にパディングを追加しましたが、これにより他の div も下に移動します。2 番目の div のみを低く表示するにはどうすればよいですか?

ここに JSFiddle があります: http://jsfiddle.net/mY6hP/

同じことがここで尋ねられましたが、受け入れられた答えはabsolute、私がやりたくないポジショニングを使用することを示唆しています。

4

2 に答える 2

5

他の div の配置を変更して、上部に配置されるようにします ( 経由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>
于 2013-08-07T21:07:01.340 に答える
0

インラインブロック表示の代わりに float:left を試してください:

<div style="float:left">div1</div>
<div style="float:left; padding-top:5px">div2</div>
<div>div3</div>
于 2013-08-07T21:11:05.197 に答える