Einfaches Div mit zwei Sätzen immer mittig auf der Seite anzeigen lassen?

Kickflip

Code

<div class="titletext">
    <a class="titletext01"> Das ist der obere Satz.</a>
    <br>
    <a class="titletext02"> Das soll direkt darunter stehen</a>
</div>

Wie sähe das CSS aus, wenn ich einfach den div.titletext immer mittig auf der Seite anzeigen wollte?

Code

div.titletext{
    font-size: 4em;
    (...)
}

Die beiden Sätze sollen mittig auf der Seite und linksbündig dargestellt werden.

Hat jemand eine Antwort?

LG und Danke

Lupus_III

Schau mal hier - https://wiki.selfhtml.org/wiki/CSS/Tutor…tung/text-align

MrMurphy

Die Frage ist nicht eindeutig: "Mittig" oder "Mittung und Linksbündig"? Wahrscheinlich innerhalb der Mitte linksbündig.

In jedem Fall muss das umgebende Element die Höhe der Seite bekommen. Die horizontale und vertikale Zentrierung erfolgt dann mittels Flexbox.

Im aktuellen HTML soll der Quelltext zudem so schlank wie möglich gehalten werden. Jedem Element eine Klasse zu vergeben ist somit schlechter Stil.

Das br-Element hat zudem eine semantische Bedeutung, die hier nicht gegeben ist.

Nach deinen knappen Informationen sehe ich zu folgendem Quelltext

Code

<div class="titletext">
   <div>
      <a> Das ist der obere Satz.</a>
      <a> Das soll direkt darunter stehen</a>
   </div>
</div>

dieses CSS

Code

.titletext {
         background-color: navajowhite;
         height: 100vh;
         display: flex;
         justify-content: center;
         align-items: center;
      }
      .titletext a {
         display: block;
      }

Die Hintergrundfarbe zeigt die Größe des div.titletext.

Jetzt mitmachen!