<style>
form {
  background: #E2EEE7;
  float: left;
  margin-bottom: 2em;
  padding: 0.7em;
  position: relative;
  width: 97.6%;
}

#main form h2 {  
  font-size: 1.8em;
  margin: 0 0 1em 0;
}

form fieldset {
  background: white;
  width: 34.9em;
}

form div {
  background: white;
  clear: both;
  float: left;
  font-size: 1.4em;
  line-height: 1.2;
  padding: 1em 1em 1em 0.8em;
  width: 93%;
}

fieldset#control div:first-child {
  background: transparent url(/images/search-top-left-corner.png) no-repeat scroll left top; 
  padding-bottom: 0.2em;
}

form fieldset#control {
 background: white url(/images/search-top-right-corner.png) no-repeat scroll right top; 
}
 
form fieldset div + div {
 background: transparent url(/images/search-bottom-right-corner.png) no-repeat scroll right bottom;
}

form fieldset#submit div {
  background: transparent url(/images/search-bottom-left-corner.png) no-repeat scroll left bottom;
  padding-left: 1.7em;
}

form fieldset#submit {
  background: white url(/images/search-bottom-right-corner.png) no-repeat scroll right bottom;
  width: 17em;
}

form label {
  color: #4E1A00;
  font-weight: bold;
  font-size: 1.4em;
  margin-bottom: 0.5em;
  width: 17em;
}

form select {
  font-size: 1em;
  width: 20em;
}

form input {
  font-size: 1em;
}

form #result {
  background: #FEFF9E;
  color: #328602;
  display: block;
  font-size: 1.2em;
  margin: 1em;
  padding: 0.4em;
}

form p#help {
  background: white;
  border-bottom: 1px solid #C1D6C8;
  border-right: 1px solid #C1D6C8;
  font-size: 1.2em;
  line-height:1.8;
  padding: 1em; 
  position: absolute;
  right: 10px;
  top: 50px;
  width: 13em;
}

</style>

  <form>
    <h2>This is a really cool form</h2>
    <fieldset id="control">
        <div>
          <label for="family">1.</label>
          <select name="family" id="family" type="text" tabindex="1">
            <option>Choose something</option>
            <option>Option1</option>
            <option>Option1</option>
          </select>
        </div> 
        <div>
          <label for="model">2.</label> 
          <select name="model" id="model" tabindex="2">
            <option>Choose something else</option> 
            <option>Option1</option>
            <option>Option2</option>
           </select>
          </div> 
     </fieldset>
     <fieldset id="submit">
       <div>
         <input type="submit" value="View Results" tabindex="3"/>
       </div>
     </fieldset>
     <p id="help">
      Can't find what you're looking for? <a href="#">Please let us know</a> - we're here to help!
     </p>
   </form>

A simple form with rounded corners, and hopefully not too much markup. You'll need some kind of graphic for the corners of course - I used 20px corners for this.

It's a bit rough, would love to know what some other people think.

Expanding form with rounded corners

form, css, html, xhtml, layout, design

HTML