HTML: Vertikale Linie erstellen – So gehts

Oft tritt das Problem auf eine Vertikale Linie in HTML zu erstellen. Eine Horizontale Linie ist kein Problem dafür gibt des den Befehl <hr>. Aber wie funktioniert dann eine Vertikale Linie?

Vertikale Linien werden zum Beispiel gebraucht, wenn du Link in Menüs voneinander Trennen möchtest.

Beispiel: Vertikale Linie in HTML erstellen

Um eine Vertikale Linie zu erstellen behelfen wir uns mit dem CSS Befehl border-right. Zuerst definieren wir uns einen Block mit einer gewissen Höhe und Breite.

Dieser DiV Container bekommt dann einen rechten Rand in der Farbe schwarz

<div class="vertikal"></div>

Und noch etwas CSS Zauberei und du hast deine Vertikale Linie.

.container{
display:block;
height:100px;
weight:200px;
border-right:1px solid black;
}

Ergebnis

Vertikale Linie als Trennstrich

Über Mich


Weitere Beiträge auf Blogseite.com




Kennst du schon diese Memes?