Konstantin40: Logo neben h1 und h2 Überschriften ausrichten

SELF-Forum

Logo neben h1 und h2 Überschriften ausrichten

Konstantin40
– Informationen zu den Bewertungsregeln

Hallo zusammen,

ich möchte ein Logo direkt neben einer h1 Überschrift und einer h2 Überschrift platzieren.
Es soll also das Bild über die beiden Zeilen gehen bzw. vertikal zentriert neben den beiden Überschriften stehen.

Ist das möglich?

Vielen Dank.
Konstantin

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Logo neben h1 und h2 Überschriften ausrichten

    Gunnar Bittersmann Homepage des Autors
    – Informationen zu den Bewertungsregeln

    @@Konstantin40:

    nuqneH

    ich möchte ein Logo direkt neben einer h1 Überschrift und einer h2 Überschrift platzieren.
    Es soll also das Bild über die beiden Zeilen gehen bzw. vertikal zentriert neben den beiden Überschriften stehen.

    Ist das möglich?

    Ja.

    Um gleich deiner nächsten Frage vorzugreifen: Wie man das machen kann, hängt davon ab, ob das Bild zum Inhalt gehört (also ein img-Element ist) oder Verzierung ist (ein Hintergrundbild per CSS).

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Logo neben h1 und h2 Überschriften ausrichten

      Konstantin40
      – Informationen zu den Bewertungsregeln

      @@ Gunnar:

      Um gleich deiner nächsten Frage vorzugreifen: Wie man das machen kann, hängt davon ab, ob das Bild zum Inhalt gehört (also ein img-Element ist) oder Verzierung ist (ein Hintergrundbild per CSS).

      Es gehört zum Inhalt in einem img Element.
      Wie kann man das in dem Fall machen?

      Vielen Dank.
      Konstantin

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Logo neben h1 und h2 Überschriften ausrichten

        Gunnar Bittersmann Homepage des Autors
        – Informationen zu den Bewertungsregeln

        @@Konstantin40:

        nuqneH

        Es gehört zum Inhalt in einem img Element.
        Wie kann man das in dem Fall machen?

        Bspw. so:

        Angenommen, das Logo hat eine Größe von 100 × 100 Pixel.

        Markup:

        <header>  
  <img src="logo"/>  
  <h1>example.com</h1>  
  <h2>The world’s best example</h2>  
</header>

        Stylesheet:

        header  
{  
  display: block;  
  padding-right: 110px; /* Breite des Logos plus etwas Luft */  
  position: relative;  
}  
  
header img  
{  
  position: absolute;  
  margin-top: -50px; /* halbe Höhe des Logos */  
  right: 0;  
  top: 50%;  
}

        Qapla'

        --
        Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
        (Mark Twain)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Logo neben h1 und h2 Überschriften ausrichten

          Texter mit x
          – Informationen zu den Bewertungsregeln

          Wenn die Überschriften weniger Höhe haben als das Logo kommt es zu wahrscheinlich unerwünschten Effekten. Das sollte man bei der Lösung im Auge behalten.

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. Logo neben h1 und h2 Überschriften ausrichten

            suit Homepage des Autors
            – Informationen zu den Bewertungsregeln

            Wenn die Überschriften weniger Höhe haben als das Logo kommt es zu wahrscheinlich unerwünschten Effekten. Das sollte man bei der Lösung im Auge behalten.

            Ich glaub' ich hab' http://de.selfhtml.org/css/eigenschaften/positionierung.htm#min_height@title=etwas im Auge.

            Beitrag melden
            –
            Informationen zu den Bewertungsregeln