JSFiddle - React, Tailwind, and code Playground

HTML

<div class="top">
</div>
<div class="all">

<div class="header">
  <img class="logo" src="images/logo_white.png" width="300" /></div>
  
 
   
<div class="parent">
  
   <a href="home.html"><div id="home">HOME</div></a>
   <a href="about.html"><div id="about">ABOUT</div></a>
   <a href="contact.html"><div id="contact">GET OFFER</div></a>
   <a href="contact.html"><div id="contact">TESTIMONIALS</div></a>
   <a href="contact.html"><div id="contact">CONTACT</div></a>
    <a href="contact.html"><div id="contact">CONTACT</div></a>
   
  </div>
  
  
  
  
  
  <div class="main">
  </div>
  
  
</div>

CSS

body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin-top: 0px;
	margin:0px;
	background-color:#f9fbfd;
}

.header {
	position:relative;
	background-color:#3d7294;
	width: inherit;
	height:150px;
	margin:0 auto;
}


.top {
	position:absolute;
	background-color:#3d7294;
	width: 100%;
	height:150px;
	margin:0 auto;
	z-index:-999;
}

.all {
	width:960px;
	margin:0 auto;
}


.logo {
	position:relative;
	top:40px;
	left:0px;
	
}

.parent {
	width:960px;
    height:300px;
	margin:0 auto;
	display:inline-block;
    background-color:#ccc;
    
}

#home {
	height:40px;
	background-color:#895892;
	text-align:center;
	line-height:40px;
	float:left;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration: none;
}

#about {
	height:40px;
	background-color:#895892;
	text-align:center;
	line-height:40px;
	float:left;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration: none;
}

#contact {
	height:40px;
	background-color:#895892;
	text-align:center;
	line-height:40px;
	float:left;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	color:#FFFFFF;
	font-weight:bold;
	text-decoration: none;
}

#home:hover {
	background-color:#99C;
	box-shadow: inset 0px 10px 20px #895892;
}

#about:hover {
	background-color:#99C;
	box-shadow: inset 0px 10px 20px #895892;
}

#contact:hover {
	background-color:#99C;
	box-shadow: inset 0px 10px 20px #895892;
}

.homebanner {
	width:100%;
	height:200px;
	background-color:#dde6ec;
}

JavaScript

var count = $(".parent a").length;
$(".parent div").width(function(){
    return ($(".parent").width()/count)-5;
}).css("margin-right","5px");