JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    <input type="input" id="searchbar" placeholder="BORDER BOX"/>
</form>

CSS

* {
    margin:0;
    padding:0;
}
body {
    background:#000;
}
form {
    width:50%;
    border:solid 1px #f00;
    padding:20px;
    margin:20px;
    
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#searchbar {
    height:31px;
    width:178px;
    /* background: url(../img/search.png) no-repeat scroll 6px 6px rgba(0, 0, 0, 0); */
    background:#000;
    color: #ff8000;
    font-size: 0.9em;
    border: 1px dotted #ff8000;
    padding: 7px 9px 7px 32px;
    margin:10px;
    
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}