JSFiddle - React, Tailwind, and code Playground

HTML

<div class="graybox">
	<div class="yellowbox"></div>
	<p>Одна или несколько строк текста размером 14px</p>
</div>
<br>
<div class="graybox">
	<div class="yellowbox"></div>
	<p>Одна или несколько строк текста, причем блок текста может быть и больше,
		чем блок слева, а может быть и меньше, как получится, хоть так, хоть так.</p>
    	<p>Одна или несколько строк текста, причем блок текста может быть и больше,
		чем блок слева, а может быть и меньше, как получится, хоть так, хоть так.</p>
    
    <h2>Подзаголовок</h2>
    
    	<p>Одна или несколько строк текста, причем блок текста может быть и больше,
		чем блок слева, а может быть и меньше, как получится, хоть так, хоть так.</p>
    
        <h2>Подзаголовок</h2>
    
    	<p>Одна или несколько строк текста, причем блок текста может быть и больше,
		чем блок слева, а может быть и меньше, как получится, хоть так, хоть так.</p>
    
            <h2>Подзаголовок</h2>
    
    	<p>Одна или несколько строк текста, причем блок текста может быть и больше,
		чем блок слева, а может быть и меньше, как получится, хоть так, хоть так.</p>
    
</div>

CSS

div.graybox{
	background-color: #efefef;
        width: 99%;
	display: table;
	border:1px solid black;
	padding: 10px;
	font-size: 14px;
    min-height: 130px;
}

div.yellowbox{
	background-color: #fafb9d;
	width: 150px;
	height: 150px;
	float: left;
	display: inline;
	margin-right: 10px; 
    border:1px solid black;
}
.graybox p{
	margin-left: 152px;
}