JSFiddle - React, Tailwind, and code Playground

by halirgb

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<ul class="categories">
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
    <li><a href="#">Some link here <i class="fa fa-caret-right"></i> </a></li>
</ul>

CSS

@import url(http://fonts.googleapis.com/css?family=Open+Sans);
body{
    font-family: 'Open Sans', sans-serif;
}
ul.categories{
    padding:0;
    margin:0;
    list-style:0;
}
ul.categories li,
ul.categories li a{
    display:block;
    position:relative;
    color:#555555;
    font-size:24px;
}
ul.categories li a:hover{
    text-decoration:none;
    color:#eb572d;
}

ul.categories li{
    padding-bottom:10px;
    padding-top:10px;
    border-bottom:1px solid #eb572d;
}

ul.categories li:last-child{
    border-bottom:none;
}

ul.categories li i{
    position:absolute;
    right:10px;
    color:#eb572d;
}