How to use -webkit-appearance: searchfield-results-decoration?

Question

Happy Holidays, everyone. I will probably feel very stupid when I get the answer to this question, but I would like to know how to use the CSS -webkit-appearance: searchfield-results-decoration rule to draw a small magnifying glass inside the search box.

I would like to create a search box similar to the one in the upper right corner of apple.com. It should have rounded corners, a magnifying glass icon and a cancel / clear button that appears after the user starts entering. I can get most of the way with

<input type="search" /> 

but this is missing a magnifying glass icon. I also know that I can create an input element with "-webkit-appearance: searchfield", but that seems to make rounded corners without the right left / right, icon, or cancel button.

I don't care if this works in Webkit since it will be used in Cocoa WebView. I don't need markup for IE, Firefox, Opera, etc.

Answer 1

, resutls="0" . , , results="5", , . , , , .

<input type="search" results="0" placeholder="Search">

Answer 2

CSS- Webkit, CSS :

style="background-image: url(glass.gif); 
       background-repeat: no-repeat; 
       background-position: left center;
       padding-left: 16px"

"", Webkit, Javascript. "position: relative; left: -16px", , , float .