JSFiddle - React, Tailwind, and code Playground

HTML

<form class="responsive">
    <input type="text" placeholder="wide input...">
        <input type="submit">
</form>

CSS

/* Responsive single-line input-and-button form styles taken from bootstrap (see e.g. http://jsfiddle.net/x8eqn/1/ ) */

form.responsive, form.responsive * {
    box-sizing: border-box;
    width: 100%;
    height: 40px; /* specify a height */
}
form.responsive {
    position: relative;
    display: table;
    border-collapse: separate;
    
    /* just to be safe */
    border: 0;
    padding: 0;
    margin: 0;
}
form.responsive > input {
    position: relative;
    width: 100%;
    float:left;
    margin-bottom: 0;
    display: table-cell;
}
form.responsive span {
    position: relative;
    width: 1%;
    vertical-align: middle;
    display: table-cell;
}
form.responsive span input {
    margin: 0;
    margin-left: -1px;
    display: inline-block;
    vertical-align: middle;
    overflow: visible;
}


/* support mobile sizes */
@media all and (max-width: 300px) {/* specify a width */    
   form.responsive span {
        display: block;
        width: 100%;
    }
    form.responsive input {
        display: block;
        width: 100%;
    }
    form.responsive span input {
        margin: 0;
    }
}



/* from here on is just for looks, not essential for the responsive single-line form */

input {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;  
}


form.responsive input {
    padding: 0 20px;
    border: 1px solid #000;
    font-family: "Helvetica", "Arial", "FreeSans", "Verdana", "Tahoma", "Lucida Sans", "Lucida Sans Unicode", "Luxi Sans", sans-serif;
    font-size: 13px;
    -webkit-font-smoothing: antialiased;
}
form.responsive input {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
form.responsive span input {
    background: #4072b4;
    color: #fff;
}
@media all and (max-width: 300px) {
    form.responsive input {
        text-align: center;
    }
    form.responsive span input {
        border-top: 0;
    }
}