JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div id="maket">
<div id="header"><img src="logo.png"></div>
<div id="menu"><div class="nav"> <div class="point"> <a href="#" class="selected">xxx</a></div> <div class="point"><a href="#"> xxx</a></div> <div class="point"><a href="#">xxx </a></div> <div class="point"><a href="#"> xxx</a></div> <div class="point"><a href="#"> xxx</a></div></div></div><div id="left">xxx</div>
CSS
div.nav{
margin:0px;
padding:0px;
list-style: none;
font-family: Tahoma, Verdana, Arial;
font-size: 13pt;
font-weight: 400;
border-bottom: none;
padding-bottom: 10px;
}
div.nav div.point {
display: inline;
margin-right: 5px;
}
div.nav div.point a {
color: #ffffff;
text-decoration: none;
border: 1px #464451 solid;
border-bottom: none;
padding: 10px 10px;
-moz-border-radius: 10px 10px 0 0; /* Для Firefox 3 */
-webkit-border-radius: 10px 10px 0 0; /* Для Safari 4 и Chrome */
border-radius: 10px 10px 0 0; /* Для современных браузеров */
/* Градиент */
background: #08457e; /* Для старых браузров */
background: -moz-linear-gradient(bottom, #08457e, #c0c0c0); /* Firefox 3.6+ */
background: -webkit-linear-gradient(bottom, #08457e, #c0c0c0); /* Chrome 10+, Safari 5.1+ */
background: -o-linear-gradient(bottom, #08457e, #c0c0c0); /* Opera 11.10+ */
background: -ms-linear-gradient(bottom, #08457e, #c0c0c0); /* IE10 */
background: linear-gradient(bottom, #08457e, #e6e6fa); /* CSS3 */
/* Конец */
}
div.nav div.point a:hover {
color: #5b6670;
border: 1px #464451 solid;
border-bottom: none;
padding: 14px 14px 10px 14px;
-moz-border-radius: 10px 10px 0 0; /* Для Firefox 3 */
-webkit-border-radius: 10px 10px 0 0; /* Для Safari 4 и Chrome */
border-radius: 10px 10px 0 0; /* Для современных браузеров */
/* Градиент */
background: #ffffff; /* Для старых браузров */
background: -moz-linear-gradient(bottom, #ffffff, #c0c0c0); /* Firefox 3.6+ */
background:...