1

即使我的#tbrdiv align设置为right，sprite 仍保持向左对齐。任何想法为什么？

普通文本、链接和图像工作正常。（向右对齐，右边距为 20px，就像它应该的那样）。

HTML：

<div id="topbar">
<div id="tbl">abc</div>
<div id="tbc">center</div>
<div id="tbr">
<div id="bar">
<a href="#" id="sound"></a>
</div>
</div>
</div>

CSS：

#topbar {

    width:100%;
    height:36px;
    padding-top:12px;
    background-color:#e7e6e6;
    border-top:1px solid #d0cdcd;
    border-bottom:1px solid #d0cdcd;


}

#tbl {float:left; width: 30%; text-align:left; padding-left:20px;}
#tbc {display:inline-block; text-align:center; width: 30%;}
#tbr {float:right; width: 30%; text-align:right; padding-right:20px;}

#bar {margin-top:-5px;}

#bar a {

    height:35px;
    display:block;
    background-image:url(http://goo.gl/yLbQ9);
    float:left;
}

#sound {width:35px; background-position:0 0;}

JSFIDDLE：http: //jsfiddle.net/B4n9T/

4

4 回答 4

2

不确定我是否完全关注你，但我认为这可能是你的问题

#bar a {
    height:35px;
    display:block;
    background-image:url(http://goo.gl/yLbQ9);
    float:left; //you want this to be right
}
于 2012-05-21T10:05:11.253 回答
1

http://jsfiddle.net/B4n9T/3/

以下是它的修复方法：

位置：相对；在#tbr 上并阻止它再次被错误定位，我设置了宽度：自动；也在上面。

于 2012-05-21T10:02:29.277 回答
1

看到这个

这是你想要的吗？

于 2012-05-21T10:05:02.577 回答
1

只要给你浮动：对你#bar这样的： -

#bar a {

    height:35px;
    display:block;
    background-image:url(http://goo.gl/yLbQ9);
    float:right;
}

我希望这会对你有所帮助....查看演示：- http://jsfiddle.net/B4n9T/5/

于 2012-05-21T10:18:07.110 回答