JSFiddle - React, Tailwind, and code Playground

HTML

<form id="searchbox" action="">
    <input id="search" type="text" placeholder="Type here">
    <input id="submit" type="submit" value="Search">
</form>

CSS

#searchbox{
	position: absolute;
	/*left: 1000px;
	top: 43px;*/
    transition: all 1s ease-in-out;
	z-index: 15;
}
#search{
	-webkit-transition: width 1s ease-in-out;
    -moz-transition: width 1s ease-in-out;
    -o-transition: width 1s ease-in-out;
    transition: width 1s ease-in-out;
}
#search:hover{
	margin-left: -40px;
	width: 181px;
}