JSFiddle - React, Tailwind, and code Playground

HTML

<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
	    <input class="search" type="search" value="" name="s" id="s">
    </form>

CSS

.search {
	    display:inline-block;
        width: 20px;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        transition: all .5s ease;
	    text-align:left;
    }
    .search:focus {
        width: 250px;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        transition: all .5s ease;
	    text-align:left;
    }