JSFiddle - React, Tailwind, and code Playground

HTML

<span><p class="post-meta ">April 7, 2017</p>
        <ul class ="social-icons clear" style="list-style: none">
          <li class="zocial-twitter">s</li>
          <li class="zocial-facebook">s</li>
          <li class="zocial-googleplus">s</li>
          <li class="zocial-reddit">s</li>
        </ul>
        </span>

CSS

@import url(http://weloveiconfonts.com/api/?family=zocial);

/* zocial */
[class*="zocial-"]:before {
    font-family: 'zocial', sans-serif;
}

.post-title {
    text-align: left;
    font-weight: 700;
}

.post-meta {
    margin-top: 0;
    color: grey;
    font-weight: 700;
    overflow: hidden; 
    float:left;
}
.social-icons li {
    display:inline;
    padding: 5px;
    float:right;
}