1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

Bild & Text auf gleicher höhe

Dieses Thema im Forum "HTML & XHTML" wurde erstellt von RMS, 16. Mai 2016.

  1. RMS

    RMS Grünschnabel

    Moinsen,
    Wie schaffe ich das mein Text und Bild auf gleicher höhe ist?

    Beispiel:
    [​IMG]
    wie man sehen kann ist der Text unten!

    Beispiel 2:
    [​IMG]
    so möchte ich das gerne haben, das der Text mittig ist!

    Mein Code:
    Code (Text):
    1.    
    2. <div style="position:absolute; bottom:0; height:30px;">
    3. <a href="#"><img src="twitter.png"></a> <a href="#"><img src="facebook.png"></a> <a href="#"><img src="youtube.png"></a> Mein Text!
    4. </div>
     
  2. SpiceLab

    SpiceLab ZENmechanic Premium-User

  3. rince1984

    rince1984 Mitglied

    Alternativ kannst du dem Elternelement (dein umschließendes DIV) die Eigenschaft "display: table" geben. Den Text des Inhalts musst du mit einem Element umschließen (z.B. DIV) und diesem Element die Eigenschaften "display: table-cell; vertical-align: middle;" zuweisen. Folgend dein Code angepasst. Ggf. musst du dem Elternelement noch eine Breite zuweisen.

    HTML:
    1. <div style="position:absolute; bottom:0; height:30px; display: table;">
    2. <a href="#"><img src="twitter.png"></a> <a href="#"><img src="facebook.png"></a> <a href="#"><img src="youtube.png"></a> <div style="display: table-cell; vertical-align: middle;">Mein Text!</div>
    3. </div>
    jsFiddle
     
Die Seite wird geladen...