0

以下を使用して、2つの写真を隣り合わせに配置しています。写真のサイズは異なります (右の写真は左の写真よりも高くなっています) が、現在のように下ではなく、上に揃えて配置したいと思います。

2番目のdivを上に揃える正しい方法に関する提案はありますか?

ありがとう

<div style="display: inline-block; margin-right: 10px">
<img src="right-side.jpg" alt="taller image">
</div>

<div style="display: inline-block; margin-right: 10px">
<img src="left-side.jpg" alt="shorter image">
</div>
4

2 に答える 2

1

1 つの方法は、次のようにコンテナー div をフロートすることです。

<div style="display:block; float: left; margin-right: 10px">
    <img src="right-side.jpg" alt="taller image" style="height: 150px;">
</div>

<div style="display:block; float:left; margin-right: 10px">
    <img src="left-side.jpg" alt="shorter image" style="height: 50px;">
</div>​

display: block;...その要素のデフォルトであるため、実際には必要ありません。

于 2012-07-10T15:07:16.393 に答える
0

私はインラインブロックを使用しません。代わりに両方を左にフロートします。

于 2012-07-10T15:07:37.227 に答える