JSFiddle - React, Tailwind, and code Playground

by Hashem Qolami

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div contenteditable="true" class="text-input form-control">
    text with background-color
</div>

CSS

.text-input {
    display: inline-block;
    width: auto;
    min-width: 200px;

    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    
    white-space: nowrap;
}

.text-input:first-line {
    background-color: gold;
}

JavaScript

$('.text-input').keypress(function(e){
    if (event.keyCode == 10 || event.keyCode == 13) {
        e.preventDefault();
        // Submit the form
    }
});