JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="test">
    <li><div class="bullet"></div><div class="one">Text Text Text</div></li>
    <li><div class="bullet"></div><div class="one">Long Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</div></li>
    <li><div class="bullet"></div><div class="one">Text Text Text</div></li>
</ul>

CSS

.test {
    list-style: none;
    margin: 0;
    padding: 0;
}

li > div{
    display:inline-block;
    height:100%;
    //background:red;
    width:5%;
    vertical-align:top;
}

.one{
    width:95%;
}

.bullet{
height:20px;
width:20px;  background:url('http://bowlingballexchange.com/applied/misc/facebook24by24.gif') no-repeat left;
    background-size:12px 12px;
}
/*
.test li:before {
    content: ">";
    padding-right: 15px;
    height:100%;
    display:inline-block;
    color:red;
}
*/