JSFiddle - React, Tailwind, and code Playground

by Artem Borovikov

HTML

<div class="block">
    <div class="content">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate dignissimos, accusamus. Accusantium dolor praesentium, recusandae, dolorum alias voluptatum earum repudiandae nesciunt officiis repellat suscipit enim harum amet labore possimus eligendi.
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos ipsum neque fugiat blanditiis cupiditate, eius quae earum eum nulla assumenda error repellendus dignissimos porro illum ipsam eveniet et vel modi. 
        <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa voluptate libero, consectetur, corporis blanditiis nobis eius ducimus temporibus mollitia praesentium repudiandae voluptatibus facere, deserunt! Maxime laboriosam soluta pariatur ab sapiente.</div>
        <div>Modi, vel neque mollitia explicabo eos, doloremque, voluptate et possimus error esse quis dolorem iusto quisquam deserunt nam animi eligendi non. Ipsum aspernatur, cupiditate necessitatibus possimus illo nam non sapiente!</div>
        <div>Suscipit hic ex tenetur, deserunt sed a, ea, porro ratione magnam nulla, optio excepturi saepe quae autem modi error odit corporis! Saepe illo voluptatem cum nihil sint amet, voluptatum placeat.</div>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea veniam quos beatae omnis eius dignissimos aliquam placeat corporis, hic magnam natus repellat veritatis quia officia ipsa esse maxime velit aperiam?
    </div>
</div>

CSS

* {
    margin: 0;
    padding: 0;
}

.block {
    display: flex;
    align-items: center;
    
    min-height: 100vh;
    background: red;
}

.content {
    display: flex;
    flex-direction: column;
}