Text links und rechts ausrichten

[thomas]

Hallo,

Wie schaffe ich es, dass ein Element links ausgerichtet wird, und ein anderes rechts?

Bsp.:

hier text                                                            hier Text

Mit einer Tabelle bekomme ich das hin, aber mit div/css schaffe ich es nicht - was aber natürlich besser wäre.

Tabelle:

<table style="width: 100%;">  
 <tr>  
  <td style="text-align: left;">hier Text</td>  
  <td style="text-align: right;">hier Text</td>  
 <tr>  
</table>

erster Versuch:

  
 <span style="margin-left: 0px; margin-right: auto;">hier Text</span>  
 <span style="margin-right: 0px; margin-left: auto;">hier Text</span>  
</div>

zweiter Versuch:

<div style="position: relative;">  
 <span style="position: absolute; left: 0cm; top: 0cm;">hier Text</span>  
 <span style="position: absolute; right: 0cm; top: 0cm;">hier Text</span>  
</div>

Gruß,
Thomas

[Gunnar Bittersmann]

@@thomas:

Wie schaffe ich es, dass ein Element links ausgerichtet wird, und ein anderes rechts?

Mit http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float.

Live long and prosper,
Gunnar

[danke]

Mit http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float.

Danke,

Mann muss aber beiden ein float geben (eines left, eines right)...

[Marc]

Hallo,

Mit http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float.

Danke,

Mann muss aber beiden ein float geben (eines left, eines right)...

Richtig - und möglichst kein span verwenden - ich kann mir nciht vorstellen, dass der rechte und der linke Text in denselben Absatz gehören. Also gib dem entsprechenden p das float mit. Wenn Du mehrere Absätze und/oder Überschriften so ausrichten möchtest, wäre es sinnvoll, um alles was rechts stehen soll ein DIV zu ziehen - ebenso um alles, was Du links ausrichten möchtest.

Viele Grüße,
Marc.

[Gunnar Bittersmann]

@@Marc:

Mann muss aber beiden ein float geben (eines left, eines right)...

Richtig

Falsch.

und möglichst kein span verwenden

Warum nicht?

ich kann mir nciht vorstellen, dass der rechte und der linke Text in denselben Absatz gehören.

Das lässt sich anhand der spärlichen Angaben vom OP nicht beurteilen.

Live long and prosper,
Gunnar

[thomas]

Falsch.

Warum?

Wenn ich nur dem Linken ein float: left gebe, wird das Rechte span >direkt< rechts neben das Linke gesetzt, das brauche ich hier aber nicht.

Gruß thomas

[Gunnar Bittersmann]

@@thomas:

Falsch.
Warum?

Darum:

p {text-align: right}  
#foo {float: left}

<p><span id="foo">foo</span> bar</p>

Live long and prosper,
Gunnar

[Marc]

Hallo,

@@thomas:

Falsch.
Warum?

Darum:

p {text-align: right}

#foo {float: left}

>   
> `<p><span id="foo">foo</span> bar</p>`{:.language-html}  
  
Dass es eine zweite, nur in diesem speziellen Fall semantisch korrekte Möglichkeit gibt, bewirkt, dass die erste Möglichkeit falsch ist?  
  
Oder handelt es sich hier um eine Spitzfindigkeit nach dem Motto: Es ist falsch, dass man es so wie in Möglichkeit eins machen muss, (was bedeuten könnte, dass es es keine andere Möglichkeit gibt, wenn man es denn unbedingt so verstehen will...)?  
  
Viele Grüße,  
Marc.

-- 
Und immer schön  
validieren (<http://validator.w3.org/>)

[thomas]

Hallo,

Richtig - und möglichst kein span verwenden - ich kann mir nciht vorstellen, dass der rechte und der linke Text in denselben Absatz gehören. Also gib dem entsprechenden p das float mit.

Doch, weil's kein genauergenommen kein Text ist, sondern nur jeweils zwei Wörter [und auch keine Überschrift -> da gibt's ein eigenes Element für ;-)].

Vielen Dank nochmal,
thomas

[Gunnar Bittersmann]

@@thomas:

Doch, weil's kein genauergenommen kein Text ist, sondern nur jeweils zwei Wörter

Sag das doch gleich.

p  
{  
    text-align: justify;  
    text-align-last: justify;  
}

für Browswer, die das schon unterstützen. IE hat hier ausnahmsweise mal die Nase vorne.

Live long and prosper,
Gunnar

[thomas]

p

{
    text-align: justify;
    text-align-last: justify;
}

  

> für Browswer, die das schon unterstützen. IE hat hier ausnahmsweise mal die Nase vorne.  
  
Nützt nur leider nichts, wenn es nicht überall geht...  
  
Danke, Thomas