JSFiddle - React, Tailwind, and code Playground

by cancerian73

HTML

<div class="search-bar">
                  <input type="text" class="sfield" name="searchterm" maxlength="30" value="Search...">
                  <input type="image" class="searchbutton" name="search" src="http://www.spheretekk.com/bc/images/search-icon.gif" alt="Search">
                </div>

CSS

.search-bar {
    height: 29px;
    background-color: #e1e1e1;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
	position:relative;
    width:230px
    }

.search-bar .searchbutton {
    position:absolute;
	top:23%;
	right:5px;
    }

.sfield {
    float: left;
    margin: 5px 0 0 8px;
    font: 8pt Verdana;
    color: #888;
    height: 20px;
    line-height: 18px;
    padding: 0;
    background: transparent;
    border: 0;
    max-width: 125px
    }