JSFiddle - React, Tailwind, and code Playground

by mubarakpasha

HTML

<ul class="trials">
     <li><span><a href="#">About Us</a></span></li>
     <li><span><a href="#">Services</a></span></li>
     <li><span><a href="#">Management Support Services</a></span></li>
	 <li><span><a href="#">Our Strengths</a></span></li>
	 <li><span><a href="#">Managements Team</a></span></li>
	 <li><span><a href="#">Contact</a></span></li>    
 
</ul>

CSS

body {
	 font-family: "Trebuchet MS", Helvetica, sans-serif;
	 font-size: 14px;
     font-weight: normal;
     line-height: 1.7em;
}

a:link {
	 text-decoration: none;
	 font-weight: bold;
}

.trials {
     margin: 0;
	 padding: 0;
	 text-transform: uppercase;
	 float: right;
}
.trials li {
     display: inline-block;
     list-style: none;
	 margin-left: 10px;
}
.trials li {
     max-width: 200px; 
     line-height: 40px;
     height: 40px;
    color:1C1C1C;
background:#D1CFD0;
 

border-radius:10px;
-moz-border-radius:15px; /* Old Firefox */
            
}
.trials li span {
     display: -moz-inline-box; /* FF2 or lower */
     display: inline-block; /* FF3, Opera, Safari */
     line-height: normal;
     vertical-align: middle;
	 text-align: center;
}
.trials li span { 
     *display  : inline; /* haslayout for IE6/7 */
}


a:link {
	text-decoration: none;
	color: #1C1C1C;
}

a:visited {
	text-decoration: none;
	color: #1C1C1C;
}
a:hover {
    color: #1C1C1C;
	
	text-decoration: none;
	
}
a:active {
	text-decoration: none;
	color: #1C1C1C;
}

.trials li:hover {

  background-color: #9CCC16;
}