JSFiddle - React, Tailwind, and code Playground

by thirtydot

HTML

<div id="nav-primary" class="nav"><nav>
    <div class="menu">
        <ul>
            <li><a href="#">link</a></li>
            <li><a href="#">link</a></li>
            <li><a href="#">link</a></li>
        </ul>
    </div>
</nav></div><!--#nav-primary-->

CSS

ul li { display: inline-block; margin-top: 10px; }

#nav-primary ul li a {
    border-top: 5px solid red;
}
#nav-primary ul li + li a {
    border-top: 5px solid blue;
}
#nav-primary ul li + li + li a {
    border-top: 5px solid green;
}