JSFiddle - React, Tailwind, and code Playground

by chris5marsh

HTML

<ul>
  <li class="container">
    <a href="#">First thing</a>
    <ul>
        <li>Mauris ullamcorper massa id erat egestas convallis. Ut tristique iaculis vulputate. Quisque scelerisque auctor diam. Proin pellentesque augue in ligula fermentum dictum. Vestibulum ultricies venenatis quam, ac auctor ligula tempor sit amet. Quisque odio elit, sodales id consequat ac, elementum a mi. Praesent ut nunc nisl, gravida sollicitudin nibh. Fusce vestibulum tellus ut nibh ultricies et lacinia ligula ullamcorper.</li>
        <li>Duis augue velit, malesuada et sollicitudin ut, accumsan eget elit. Cras placerat urna in felis pulvinar varius. Sed eget diam ac enim aliquet lobortis. In volutpat eros id ante interdum eu aliquet sem ornare. Suspendisse at orci lacus. Suspendisse posuere nisi nec risus feugiat dapibus. Nullam in diam ut sem pulvinar porttitor. Vestibulum sollicitudin posuere eros, a porta dolor accumsan quis. Curabitur tristique, dolor nec convallis pretium, ipsum ante facilisis dolor, sit amet mattis est eros eu enim. Fusce eu purus vitae lorem elementum fermentum. Praesent sit amet ipsum eget justo tristique porta.</li>   
    </ul>

  </li>
</ul>

CSS

.container {
    width:100%;
    height:100%;
    display:table;    
}
.container a,
.container div {
    display:table-cell;
    vertical-align:middle;
}