Sprite Aligné à droite

Question

Même si mon #tbr div align est réglé sur droite, sprites continuent à aligner sur la gauche. Des idées pourquoi?

Le texte normal, les liens et les images fonctionnent bien. (aligné à droite, avec 20px marge de droite, comme il est censé être).

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/

Answer 1

Je ne sais pas si je vous suivais ici tout à fait, mais je pense que cela pourrait être votre problème

#bar a { 
    height:35px; 
    display:block; 
    background-image:url(http://goo.gl/yLbQ9); 
    float:left; //you want this to be right 
} 

Answer 2

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

Voilà comment il est fixé:

position: relative; sur #tbr et pour l'arrêter étant mal positionné à nouveau j'ai mis la largeur: auto; à ce sujet aussi.

Answer 3

See this

Est-ce que vous vouliez?

Answer 4

Il suffit de donner float: right vous #bar un comme celui-ci: -

#bar a { 

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

J'espère que cela vous aidera .... voir la démo: - http://jsfiddle.net/B4n9T/5/