JSFiddle - React, Tailwind, and code Playground

HTML

<header>
<nav>
    <h1>my page</h1>
    <ul>
        <a href="#"><li>Home</li></a>
        <a href="#"><li>blog</li></a>
        <a href="#"><li>about</li></a>
        <a href="#"><li>contact</li></a>
        <a href="#"><li>links</li></a>
    </ul>
</nav>

CSS

header{
background:#999;
color:white;
padding:15px 15px 0 15px;
}

header h1{
margin:0;
display:inline;
}

nav ul{ 
margin:0;
display:inline;
padding:0 0 0 15px;
    float:right;
        margin-top:-5px
}
nav ul:after{clear:both;}

nav ul li{
background:black;
color:white;
display:inline-block;
list-style:none;
padding:5px 15px;

}