<div contenteditable="true" 
  id="message" class="textarea_like_whatsapp" data-text="Type something...">       
   </div>

   .textarea_like_whatsapp {
      display: block;
      min-height: 60px;
      max-height: 98px;
      overflow-x: auto;
      width: calc(100% - 103px);
      line-height: 21px;
      padding: 10px;
      font-size: 15px;
      line-height: 25px;
      float: left; 
     border: 2px solid gray;
    }

    [contentEditable="true"] {
      &:empty {
        &:not(:focus) {
          &:before {
            content: attr(data-text);
          }
        }
      }
    }
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.