JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <ul id="navbar">
        <li><a href="link naam/">Blog</a></li>
        <li><a href="link naam">Portfolio</a></li>
        <li><a href="link naam">About me</a></li>
        <li><a href="link naam">Contact</a></li>
    </ul>
</div>

CSS

#navbar {
    width: 1204px;
    list-style-type:none;
    margin:0 auto;
    padding:0px;
}

#navbar li {
    float:left
}

#navbar li a {
    display:block;
    width:291px;
    font-weight:1000;
    margin:0px;
    font-size:25px;
    padding:5px;
    text-decoration:none;
    background-color:#F7D4FF;
    color:#3F004F;
}

#navbar li a:hover {
    background-color:#EC9CFF;
}