JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <p>This is some content that should wrap... This is some content that should wrap... This is some content that should wrap... This is some content that should wrap... This is some content that should wrap...</p>
</div>

CSS

.container {
    position: relative;
    max-width:100vh;
    max-height:100%;
    margin:0 auto;
    overflow: hidden;
    
    border: 1px solid red;
}
.container:before {
    content:"";
    display: block;
    margin-top: 100%;
}
p {
    position: absolute;
    top: 0;
    left: 0;
}