JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <textarea name="somename" id="" cols="20" rows="10"></textarea>
    <div class="controls">
        <button>Post as Anonymous</button>
    </div>
</div>

CSS

*{
    padding: 0;
    margin:0;
}
.wrapper{
    background: #eee;
    border: 1px solid #999;
    width: 600px;
}
.wrapper textarea{
    background: linear-gradient(to bottom, #e5e5e5 0%,#f2f2f2 100%);
    border:none;
    width:100%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px dotted #999;
    resize: none;
}
.wrapper textarea:focus{
    outline: none;
}
.controls{
    text-align: right;
    margin-top: -6px;
}
button{
    background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
    border: 1px solid #999;
    padding: 10px 25px;
    font-weight: bold;
    color: rgb(77,77,77);
    border-width: 1px 0 0 1px;
}