html - div与css背景的水平对齐

Question

我想在 div 内的两个按钮之间对齐图片

<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<div class="picture"> 你需要关闭它<div class="picture">&nbsp;</div>

之后，您需要为包含背景图像的类添加一个height和。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;


}

然后，您可以对齐图像。

下面是演示。

工作演示

希望这可以帮助。

添加在：

如果您想根据您的代码垂直对齐图像，下面是演示。

工作演示