JSFiddle - React, Tailwind, and code Playground
HTML
<div class="content">
<h1>Contoh Label Blog</h1>
<ul>
<li><a href="#">CSS</a><span>120 artikel</span></li>
<li><a href="#">Javascript</a><span>150 artikel</span></li>
<li><a href="#">HTML</a><span>200 artikel</span></li>
<li><a href="#">Jquery</a><span>80 artikel</span></li>
<li><a href="#">Tutorial</a><span>100 artikel</span></li>
</ul>
</div>
CSS
body{
color:#fff;
padding:20px;
background:#efefef;
font:normal 14px Arial,verdana,serif;
}
h1{
margin-bottom:10px;
font:bold 20px Arial,verdana,serif;
text-transform:uppercase;
margin:0 0 10px;
padding:3px 0 3px 7px;
border-bottom:1px solid #222;
box-shadow: 0 1px 0 #444;
-moz-box-shadow: 0 1px 0 #444;
-webkit-box-shadow: 0 1px 0 #444;
}
a{
text-shadow: 0 1px 0 #000000;
color: #999!important;
text-shadow: 0 1px 0 0#000;
transition: color 0.26s ease;
-moz-transition: color 0.26s ease;
-webkit-transition: color 0.26s ease;
text-decoration:none}
.content {
background-color: #333333;
padding: 10px;
width: 300px;
box-shadow: 0 1px 5px #444;
-moz-box-shadow: 0 1px 5px #444;
-webkit-box-shadow: 0 1px 5px #444;
}
ul li {
-moz-transition: padding 0.26s ease 0s;
background: url("http://3.bp.blogspot.com/-k6_8TWlD4Hw/Tzt-ABkEYsI/AAAAAAAABE0/MStiezjcvfM/s1600/icon-new-window.png") no-repeat scroll left center transparent;
list-style-type: none;
margin: 0 0 5px;
padding-left: 20px;
}
ul li a{
border-radius:0.5em;
-moz-border-radius:0.5em;
-webkit-border-radius:0.5em;
-o-border-radius:0.5em;
display:inline-block;
margin:0;
}
ul li:hover span {
margin-left: 20px;
opacity: 1;
}
ul li span {
background:#000;
border-radius: 0 10px 10px 0;
-moz-border-radius: 0 10px 10px 0;
-webkit-border-radius: 0 10px 10px 0;
color: #FFF;
height: auto;
margin-left: 100px;
opacity: 0;
position: relative;
text-align: center;
width: auto;padding: 2px 8px;
transition: all 0.3s cubic-bezier(1,2,0,0) 0s;
-moz-transition: all 0.3s cubic-bezier(1,2,0,0) 0s;
-webkit-transition: all 0.3s cubic-bezier(1,2,0,0) 0s;
}
ul li span:before{
content:"";
width:0px;
height:0px;
position:absolute;
right:100%;top:0px;
border-width:10px;
border-style:solid;
...