JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<input value="This has height of 200px"/>
This will always start at the middle cause input's have one line
<br/><br/>
<textarea>But this will accomplish what your message container wants to be like</textarea>

CSS

input {
    height: 200px;
}
textarea {
    height:200px;
}