JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main_menu" class="wrapper_nav_box">
            <div class="nav_box">
                <a href="writing.html">WRITING</a> 
            </div>
            <div class="nav_box">
                <a href="http://tumblr.com">BLOG</a>
            </div>
            <div class="nav_box">
                <a href="contact.html">CONTACT</a>
            </div>
    </div>

    <hr class="line_break">

CSS

.line_break{
    width:1000px;
    height: 5px;
    float: left;
    color: black;
    //padding-top: 3px;
    background-color: rgba(255,255,255,.5);
    border: none;
    border-bottom: 3px solid black;