JSFiddle - React, Tailwind, and code Playground

by richlewis14

HTML

<div class="skillsDouble">
              <ul>
                 <li><a href="#">Automation</a></li>
                 <li><a href="#">TDD</a></li>
              </ul>
            </div>
            <!--End skills double-->

CSS

ul {
    list-style-type:none;  
}

ul li a{
    text-decoration:none;
}

.skillsDouble {
float: left;
margin-right: 1px;
}

.skillsDouble li {
   width:100px;
   padding: 11px 16px;
   text-align:center;
    float:left;
    background: #333333;
  margin-left:10px;
-webkit-transition:all 2s ease;
}

.skillsDouble li:hover {
  background:green;

   
 
}

.skillsDouble li a {
  color:white;
}