fabs07: Inhalt Tabellzelle läßt sich nicht rechts ausrichten

Hallo,

folgendes habe ich (aufs Wesentliche reduziert):

<table>  
<tr><td width="300">  
<a href="#" class="button"><span>Button</span></a>  
</td></tr>  
</table>

die css dazu:

a.button {  
    background: transparent url('../image/bg_button_a.gif') no-repeat scroll top right;  
    color: #8c3a3a;  
    display: block;  
    float: left;  
    font: bold 12px arial, sans-serif;  
    height: 24px;  
    margin-right: 6px;  
    padding-right: 18px;  
    text-decoration: none;  
}  
a.button span {  
    background: transparent url('../image/bg_button_span.gif') no-repeat;  
    display: block;  
    line-height: 14px;  
    padding: 5px 0 5px 18px;  
} 

Ich möchte nun gerne, dass dieser Button in der Zelle rechts ausgerichtet wird. Aber egal wo und wie ich es versuche, er bleibt immer links! Ich habe auch schon um das <a> herum ein zusätzliches <div> gestezt, aber das ist ihm auch egal.

Setze ich vor und hnter den Button ein paar Zeichen

ANFANG<a href="#" class="button"><span>Button</span></a>ENDE  

Dann sieht das Ergebnis so aus:
[BUTTON] ANFANGENDE

Warum ist dem so und gibt es eine Lösung dafür?

Danke
Fabs

  1. Hallo,

    warum sollte ein Browser den Link auch rechts anzeigen?

    Vielleicht wegen dem float:left?

      
    a.button {  
        float: left;  
    }  
    
    

    Viele Grüße Novi

    --
    "(...) deshalb mag ich Binärtechnik. Da gibt es nur drei Zustände: High, Low und Kaputt." (Wau Holland)
    1. Hallo Novi,

      warum sollte ein Browser den Link auch rechts anzeigen?

      Vielleicht wegen dem float:left?

      Dein Einwand klingt logisch aber nach einigem rumprobieren komme ich trotzdem nicht weiter und ich versteh es auch weiterhin nicht.

      Folgendes habe ich probiert:

      <td width="320" align="right"><div><a class="button" href="#"><span>Starteinstellungen</span></a></div></td>  
      
      

      Ich verstehe das so:

      • eine Zelle mit 320px Breite
      • Inhalt wird rechts ausgerichtet
      • der Inhalt besteht aus einem DIV in dem eigentliche Button enthalten ist

      Warum sollte das float:left im <a> (was es übrigens braucht) einen Einfluss auf das DIV bzw. sogar das <td> haben?

      Es ist letztlich egal ob mit oder ohne <div> und auch ein style="text-align: right;" im <div> macht keinen Unterschied.

      Ich kapier's nicht .... kannst Du es mir erklären?

      Grüße
      Fabs

      1. Hi,

        Folgendes habe ich probiert:

        <td width="320" align="right"><div><a class="button" href="#"><span>Starteinstellungen</span></a></div></td>

        
        > Ich verstehe das so:  
        > - eine Zelle mit 320px Breite  
        > - Inhalt wird rechts ausgerichtet  
        > - der Inhalt besteht aus einem DIV in dem eigentliche Button enthalten ist  
          
        Das Element DIV als Block-Element ist so breit, wie der zur Verfügung stehende Platz. Das kannst du also „ausrichten“, wie du willst, die Positionierung bleibt immer die gleiche.  
          
        
        > Warum sollte das float:left im <a> (was es übrigens braucht) einen Einfluss auf das DIV bzw. sogar das <td> haben?  
          
        Niemand sagt, dass es den hat.  
        Aber das A-Element wird im DIV, das über die komplette Breite geht, nach links gefloatet, also wird es auch links platziert.  
          
        MfG ChrisB  
          
        
        -- 
        “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
        
      2. Om nah hoo pez nyeetz, fabs07!

        <td width="320" align="right"><div><a class="button" href="#"><span>Starteinstellungen</span></a></div></td>
        
        > 
        
        

        Aus meiner Sicht kann/muss daraus werden:

        <td width="320" align="right"><a class="button" href="#">Starteinstellungen</a></td>
        
        > 
        
        

        denn weder das div noch das span haben irgendwelchen besonderen Inhalt.

        Es sieht auch sehr nach Layouttabelle aus.

        Matthias

        --
        http://www.billiger-im-urlaub.de/kreis_sw.gif
        1. Om nah hoo pez nyeetz, apsel!

          edit

          <td width="320" align="right"><a class="button" href="#">Starteinstellungen</a></td>
          
          

          Matthias

          --
          http://www.billiger-im-urlaub.de/kreis_sw.gif