JSFiddle - React, Tailwind, and code Playground

HTML

<title> CentrovanĂ˝ float;
		</title>
	</head>
	<body>
		<div>
			<ul>
				<li>
				<a href="#">Home</a></li>
				<li>
				<a href="#">Zednictvi</a></li>
				<li>
				<a href="#">Sport</a></li>
				<li>
				<a href="#">Budoucnost</a></li>
			</ul>
		</div>
	</body>
</html>

CSS

<!DOCTYPE html>
	<head>
	
		<style>
ul {
	margin: 1 auto;
	display: table;
}
li {
	display: table-cell;
}
a {
	float: left;
	padding:0;
  width: 200px;
	color: #fff;
	font-weight:bold;
	border-right: 1px solid #fff;
	background: #C80000;
	text-decoration: none;
}
a:hover {
	background: #FFCC33;
}
		</style>
		<!--[if lte IE 7]>
		<style>
div {
	text-align:center;
}
ul {
	display: inline-block;
}
ul {
	display: inline;
}
ul li {
	float: left;
}
</style>
		<![endif]-->