html - CSSの背景を持つdivの水平方向の配置

Question

div 内の 2 つのボタンの間に画像を配置したい

<div>
<button class="button">left</button>
<div class="picture">
<button class="button">right</button>  
</div>

これは私が試したことです http://jsfiddle.net/27YPH/

画像にimgタグを使用すると機能しますが、css-backgroundプロパティを使用して画像を設定するとめちゃくちゃになります

画像はスプライトなので img タグは使いたくない

2つのボタンの間に背景のあるdivを配置するにはどうすればよいですか?

Answer 1

コードが正しくありません。<div class="picture"> You need to close it byの終了 div がありません<div class="picture">&nbsp;</div>

その後、背景画像を含むクラスにheightandを付ける必要があります。width

例えば、

.picture
{
    float:left;
    background:url("http://nuclearpixel.com/content/icons/2010-02-09_stellar_icons_from_space_from_2005/earth_128.png") 0 0;
    width:128px; height:128px;


}

そして、画像を整列させることができます。

以下はデモです。

ワーキングデモ

お役に立てれば。

拡張機能：

コードに従って画像を垂直方向に配置する場合は、以下のデモをご覧ください。

ワーキングデモ