JSFiddle - React, Tailwind, and code Playground

HTML

<div id='container'>
    <div id="list">
        <ul>
            <li>
                <div id='image'>
                    <img src='http://sstatic.net/stackoverflow/img/favicon.ico'/>
                </div>
                <div id='event'>
                    <h1>Text</h1>
                    <h2>More Text</h2>
                </div>
            </li>
            <li>
                <div id='image'>
                    <img src='http://sstatic.net/stackoverflow/img/favicon.ico'/>
                </div>
                <div id='event'>
                    <h1>Text</h1>
                    <h2>More Text</h2>
                </div>
            </li>
        </ul>
    </div>
</div>

CSS

#list ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
#list li {
    border: 2px solid #DDD;
    margin-bottom: 3px;
    height: 110px;
}
#image {
    width: 75px;
    height: 100%;
    float: left;
    line-height: 110px;
    text-align: center;
}
#image img {
    vertical-align: middle;
}
#event {
    margin-left: 75px;
}