| hinter jedem Nav-Punkt

[Sophie]

Hallo,

geht es auch einfacher bzw. schöner?

<nav class="top">
		<ul>
			<li><a href="#">Punkt 1</a> | </li>
			<li><a href="#">Punkt 2</a> | </li>
			<li><a href="#">Punkt 3</a> | </li>
			<li><a href="#">Punkt 4</a> | </li>
			<li><a href="#">Punkt 5</a> | </li>
		</ul>
	</nav>

Hinter jedem <li> soll ein Strich nach unten kommen.

Das CSS

.top {
	margin-top: 1.5em;
}

.top ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
}

.top ul li {
	text-transform: uppercase;
	font-size: 0.813em;
}

.top ul li a {
	color: #013c6d;
	text-decoration: none;
}