thomas: Text links und rechts ausrichten

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

  1. @@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

    --
    Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
    1. Mit http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float.

      Danke,

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

      1. 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.

        --
        Und immer schön
        validieren (http://validator.w3.org/)
        1. @@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

          --
          Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
          1. 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

            1. @@thomas:

              Falsch.
              Warum?

              Darum:

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

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

              Live long and prosper,
              Gunnar

              --
              Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
              1. 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/>)
                
        2. 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

          1. @@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

            --
            Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
            1. 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