JSFiddle - React, Tailwind, and code Playground

HTML

<aside id="deviceInfo">
    <div class="font">
        <div class="header">Aside</u></div>
            <b>Header 1:</b><br> 
            <div class="textarea-wrapper">
            <textarea disabled style="background-color: white; max-height:160px; max-width:295px; position: relative;" cols="35" rows="3">info</textarea><br>
            </div>
            <b>Header 2:</b><br> 
            info<br>
            <b>Header 3:</b><br>
            <div class="textarea-wrapper">
            <textarea disabled style="background-color: white; max-height:160px; max-width:295px; position: relative;" cols="35" rows="3">info</textarea><br>
            </div>
        </div>
    </div>
</aside>

CSS

.border { border: 1px solid red; }
.textarea-wrapper { position: relative; max-height: 72px; }
.textarea-wrapper textarea {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    min-height: 60px;
    max-height: 160px;
    padding: 5px;
    border: 1px solid #ddd;
}