JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li class="icon"><a href="#">Link 1</a></li>
    <li class="icon"><a href="#">Link 2</a></li>
    <li class="icon">No Link Here</li>
</ul>

<p>Here's the image as it should appear in the items above (note the top border on the upper balloon): <img src="http://www.borngeek.com/images/2013/stack_overflow_ex_01.gif" /></p>

CSS

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul li {
    display: inline;
    font-size: 13px;
    margin: 0 1em 0 0;
    padding: 2px 0;
    border: 1px solid red;
}

ul li.icon {
    background: url(http://www.borngeek.com/images/2013/stack_overflow_ex_01.gif) no-repeat left center;
    padding-left: 22px;
}