JSFiddle - React, Tailwind, and code Playground

by Zero Fx

HTML

<div class="test">
    <p>Lalala laaaaa lalalalalaa!!!! Lalala laaaaa lalalalalaa!!!! Lalala laaaaa lalalalalaa!!!! <br/>текст який по замовчуванню центруєся до лівого верхнього вугла... може бути віджатий паддінгами або маргінами</p>
</div>

<br/>

<div class="test2">
    <p>Блак який прижати абсолютним позиціонуванням до нижу... і може регулюватися в ліво-право та верх-нихз<br/>
        Lalala laaaaa lalalalalaa!!!! Lalala laaaaa lalalalalaa!!!! Lalala laaaaa lalalalalaa!!!!</p>
</div>

CSS

* {
    padding:0;
    margin:0;
}

.test {
    width: 400px;
    height: 200px;
    border: 2px solid red;
    background-color: #ccc;
    margin: 0 auto;
    position: relative;
}

.test p {
   text-align: left;
    font-size: 16px;
    font-family: 'Arial';
}

.test2 {
    width: 400px;
    height: 200px;
    border: 2px solid red;
    background-color: #ccc;
    margin: 0 auto;
    position: relative;
}

.test2 p {
   position: absolute;
   left:0;
   bottom:0;
   text-align: left;
    font-size: 16px;
    font-family: 'Arial';
}