cssを使ってこれらを水平に並べて整列させるにはどうすればよいですか？

Question

私が下に表示すると、「Here is some text is」というテキストが画像の下にあります - 画像の右側に表示しますか？

<div style="width:50px;"> 
    <img src="http://assets.devx.com/MS_Azure/azuremcau.jpg" alt="blah" width="70" height="70" /> 
</div> 

<div style="width:150px;"> 
    <h2>Here is some text</h2> 
</div> 

Answer 1

<div style="width:50px; display: inline-block;"> 
<img src="http://assets.devx.com/MS_Azure/azuremcau.jpg" alt="blah" width="70" height="70" /> 
</div> 

<div style="width:150px; display: inline-block"> 
    <h2>Here is some text</h2> 
</div> 

変更フロート：インラインブロック：表示するには、左。これは、ドキュメントフローからアイテムを削除しないため、より良い解決策です。あなたがすべての1つのための幅を指定することを確認してください。

Answer 2

<div style="float: left; margin-right: 10px;"> 
    <img src="http://assets.devx.com/MS_Azure/azuremcau.jpg" alt="blah" width="70" height="70" /> 
</div> 
<div style="width: 300px;"> 
    <h2>Here is some text</h2> 
</div> 
<br style="clear: both;" /> 

これは動作するはずです。