Text mittig in div platzieren



  • Hi,

    ich möchte gern zwei Wörter innerhalb eines divs platzieren (<div mitte>), so dass das linke-Wort (Links) 60px und das rechte-Wort (Rechts) 60px von der Mitte weg sind.

    Hier mal die Darstellung als Bildchen...

    |                 Links        |                   Rechts   |
    linker Rand div             mitte div                       rechter Rand div
    
    //def von mitte: 
    //#mitte {margin: 0 0 1em 240px;padding: 0 1em;}
    
    <div mitte>
    
    <div style="float:center; text-align:center; padding-right:60px;" >Links</div>
    <div style="float:center; text-align:center; padding-left:60px;">Rechts</div>
    
    </div>
    

    Bis jetzt ist zwar das erste Wort "Links" richtig platziert, aber das zweite nicht; es sollte sich in der gleichen Zeile befinden (bis jetzt sind es zwei Zeilen).

    Gruß
    Steffen



  • ein div ist ein block-element, nimmt also immer so viel breite ein, wie das Elternelement zulässt.
    Wenn du das nicht willst, musst du entweder ein inline-element verwenden oder dein div auf ein solches umbiegen

    übrigens gibt es kein ' float: center; '. float erlaubt left , right oder none



  • 2 div nebeneinander. Eine floaten lassen und dieser 50% Breite geben.
    Dann in beiden div den Text zentrieren.

    <div style="float:left; text-align:center; width:50%; background-color:red" >Links</div>
    <div style="text-align:center; background-color:blue">Rechts</div>
    


  • Scheppertreiber schrieb:

    2 div nebeneinander. Eine floaten lassen und dieser 50% Breite geben.
    Dann in beiden div den Text zentrieren.

    <div style="float:left; text-align:center; width:50%; background-color:red" >Links</div>
    <div style="text-align:center; background-color:blue">Rechts</div>
    

    Vielen Dank das sieht sehr gut aus; allerdings muss ich jetzt die beiden Texte noch um 60px nach links bzw. rechts verschieben können? Mit padding passiert leider nichts. Gibt es hierfür ein anderes CSS-Wort?


Anmelden zum Antworten