Sven Rautenberg: span mit text-align im TD

Beitrag lesen

Moin!

<TR><td>

<span style="text-align:left;">text1</span>
<span style="text-align:right;">text2</span>
</TD></TR>


>   
> MEINER meinung nach müsste nun eine Tabellenzelle auf dem Bildschirm erscheinen, die 500px breit ist, eine einzige Zeile umfasst, bei der Links 'text2' steht und rechtsbündig 'text2'.  
  
Wird nicht passieren.  
  
text-align richtet den Text INNERHALB des Elements aus. Beispielsweise richtet <td style="text-align:right"> den Text in dieser Tabellenzelle rechtsbündig aus.  
  
Das sieht man aber nur, wenn es zusätzlich zu dem Platz, den der Text einnimmt, noch weiterer leerer Platz existiert. Wenn die obige Tabellenzelle exakt so breit ist wie der enthaltene Text (z.B. nur ein einziges Wort), dann wird man den Effekt von text-align auch nicht sehen.  
  
<span> sind inline-Elemente, d.h. sie sind z.B. exakt so breit, wie ihr Textinhalt. Insofern ist es schon deshalb unmöglich, dass du mit text-align das SPAN-Element nach links oder rechts bewegst, weil sich damit eben nur der Text im SPAN an den linken oder rechten Rand vom SPAN bewegen würde - da aber sichtbar nichts passiert, weil kein freier Platz zum Rücken vorhanden ist.  
  
Abgesehen davon bezweifle ich, dass die CSS-Eigenschaft text-align für inline-Elemente überhaupt zulässig ist (ich hab jetzt aber keine Lust, das nachzugucken, wird bestimmt gleich jemand was zu schreiben, der es auswendig weiß).  
  
Zur Lösung deines Problems:  
a) Wenn du die eine Tabellenzelle teilst, und die linke TD linksbündig, die rechte rechtsbündig machst, kannst du aufs SPAN verzichten.  
b) alternativ ersetze SPAN durch DIV und richte diese dann mit float:left bzw right aus.  
  
 - Sven Rautenberg