<div class="container">
  <textarea 
    class="input input--textarea"
    placeholder="Type text here"
  ></textarea>
</div>
.container {
  flex-grow: 1;
  max-width: 500px;
  margin: 1rem;
  padding: 1rem;
  box-sizing: border-box;
  background: turquoise;
  background-image: linear-gradient(to left,
    lightseagreen 40px, transparent 0
  );
}

.input {
  width: calc(100% - 40px);
  
  height: 100px;
  border: 1px solid lightseagreen;
  box-sizing: border-box;
  padding: .5em;
  box-shadow: 0 0 10px rgba(0, 0, 0, .5) inset;
  font: inherit;
}

/* Helpers */
BODY {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  font: 18px/1 Trebouchet MS, Arial, sans-serif;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.