Minimal Form Field

by smombartz

HTML

<div id="formfield">
  <form id="wp-direct-install-url" name="wp-direct-install-url" method="post" action=""> 
    <input type="text" name="url" id="url" onfocus="this.value = this.value;" placeholder='Grid Size in px' />
    <input onClick="_gaq.push(['_trackEvent', 'WP Plugin', 'Direct Install', 'v1000']);" class="submit" type="submit" value="Go">
  </form>
  
  <div id="error"></div>

CSS

html {
  background-color: white;
  font-family: 'Droid Sans';
}

#formfield form { 
  margin: 10px 0;
  height: 56px;
}

#formfield input {
  float: left;
  font-size: 24px;
  color: #333;
  text-decoration: none;
  border-width: 1px;
  border-style: solid;
}

#formfield input#url {
  width: 330px;
  height: 50px;
  border-left-width: 0;
  border-top-width: 0;
  border-right-width: 0;
  border-bottom-width: 1px;
  font-size: 18px;
  outline: none;
  color: #333;
  background: #fff;
  border-color: #999;
  padding: 0 0 0 10px;
  margin: 0 10px 0 0;
}

#formfield input.submit {
  width: 90px;
  height: 50px;
  text-decoration: none;
  text-align: center;
  border-color: #999;
  border-radius: 3px;
  background: #FCFCFC;
}

#formfield #error {
  width: 350px;
  height: 20px;
  color: red;
  font-size: 18px;
  font-size: 13px;
  display: inline;
}