JSFiddle - React, Tailwind, and code Playground

HTML

<div id="up-events" >
    <ul>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
    </ul>
        <br class='clear'>
    <ul>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE LONG LONG LONG LONG LONG</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE LONG LONG LONG</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE LONG LONG LONG</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>    
    </ul>
        <br class='clear'>
    <ul>    
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE</a></h3>
                <div class='where'>January 1, 1970<br> Dnepropetrovsk, UA</div>
            </div>
        </li>
        <li>
            <div class="events">
                <h3><a href="#">H3 TITLE</a></h3>
                <div class='where'>January...

CSS

#main h5 {padding:0px; margin:0px; color:#333; font-size:12px}
.events {width:185px}
.events div.where {color:#666}
#up-events ul {font-size: 1em;overflow:hidden}
#up-events ul {border:1px dotted #DDDDDD; border-right:0px; border-bottom:0px}
#up-events ul li {display:inline; float:left; border:1px dotted #DDDDDD; border-left:0px; border-top:0px; padding:10px}
#up-events ul li h3 {margin-top:0px}
#up-events ul {float:left; display:block}
#main ul {margin-bottom: 10px;}

JavaScript

$("#up-events ul").each(function(){
    $(this).find("li").height($(this).height()-20)
    document.title += $(this).height();
})