How to Make an OS X Style Search in XHTML/CSS

Question

Any way to make a OS X Finder "like" but valid XHTML/CSS search textfield with an X to the right, etc.? Even if it only shows up on Safari but degrades that would be fine. I've seen a couple of examples but they seem very complicated.

Answer 1

If you're OK with supporting only the newest WebKit-based browser, you can use the new HTML5 feature like this:

<form>
  <input name="q" type="search">
  <input type="submit" value="Find">
</form>

That's it, no CSS, no Javascript or whatever! See an excellent discussion here.