background color in select list options

I'm trying to display color options in a select list. Just the color. I am using this:

<select name="color">
            <option value="#000000">Black - <img src='images/spacer.gif' width='50' height='10'></option>
                              <option value="#FF0000" selected><span style="background-color: #FF0000;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#0000FF" ><span style="background-color: #0000FF;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#00FF00" ><span style="background-color: #00FF00;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#800080" ><span style="background-color: #800080;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#FFFF00" ><span style="background-color: #FFFF00;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#00FFFF" ><span style="background-color: #00FFFF;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#00FFFF" ><span style="background-color: #00FFFF;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#FF8C00" ><span style="background-color: #FF8C00;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#FF1493" ><span style="background-color: #FF1493;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#FFD700" ><span style="background-color: #FFD700;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#A0522D" ><span style="background-color: #A0522D;"><img src="images/spacer.gif" width="50" height="10"></span></option>
                              <option value="#000080" ><span style="background-color: #000080;"><img src="images/spacer.gif" width="50" height="10"></span></option>
            </select>

spacer.gif is a one pixel x one pixel transparent gif.

The first option (Black) is inconsistent, please ignore that.

All the colors show as white.

How can I make this work? Or is there a way? Of course I could use radionbuttons, what a pain & takes more space.

Thanks