JSFiddle - React, Tailwind, and code Playground

by klierik

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<nav>
    <a href="#">Lorem</a>
    <a href="#">Aenean</a>
    <a href="#">Consectetur</a>
    <a href="#">Adipiscing</a>
</nav>

SCSS

body {
    background: #000;
}
nav {
    padding: 20px 30px;

    > a {
        display: inline-block;
        padding: 0 15px;
        
        line-height: 50px;
        
        &:before,
        &:after {
            display: block;
            height: 1px;
            
            content: '';
            
            background: transparent;
        }
        
        &:hover {
            &:before,
            &:after {
                background: #fff;
            }
        }
    }
}