JSFiddle - React, Tailwind, and code Playground

HTML

<div id='cssmenu'>
			<ul>
   			<li class='active'><a href='index.html'><span>Hem</span></a></li>
   			<li><a href='#'><span>Schema</span></a></li>
   			<li><a href='#'><span>Blogg</span></a></li>
   			<li class='last'><a href='#'><span>Kontakt</span></a></li>
			</ul>
		</div>

CSS

#cssmenu {
	font-family: Source Sans Pro ExtraLight;
	font-size:18px;
	text-decoration:none;
	list-style: none;
	width: 200px;
	top: 40%;
	right: 0%;
	position: absolute;
}
#cssmenu li {
  	margin: 0;
  	padding: 8px;
  	list-style: none;
	float: none;
}

#cssmenu a {
  	background: #000;
  	border-right: 4px solid;
  	border-right-color: #06f;
  	color: #fff;
  	display: block;
  	margin: 0;
  	padding: 15px 75px;
  	text-decoration: none;
  	font-weight: normal;
  
 	-webkit-transition: background 150ms ease-in .25s; /* property duration timing-function delay */
    -moz-transition: background 150ms ease-in .25s;
    -o-transition: background 150ms ease-in .25s;
    transition: background 150ms ease-in .25s;


    -webkit-transition-property: background;
    -webkit-transition-duration: 150ms;
    -webkit-transition-timing-function: ease-in;
    -webkit-transition-delay: 100ms;

    -moz-transition-property: background;
    -moz-transition-duration: 150ms;
    -moz-transition-timing-function: ease-in;
    -moz-transition-delay: 100ms;

    -o-transition-property: background;
    -o-transition-duration: 150ms;
    -o-transition-timing-function: ease-in;
    -o-transition-delay: 100ms;

    transition-property: background;
    transition-duration: 150ms;
    transition-timing-function: ease-in;
    transition-delay: 100ms;
}

#cssmenu a:hover {
  	background: #06F left center no-repeat;
  	color: #fff;
  	padding-bottom: 8px;
  	padding: 15px 75px;
	text-align: left; 
}