CSS background url () does not appear in IE, works in FF / Safari


I'm debugging my website for the dreaded IE6 but I'm officially stumped.

Appearance in Firefox: http://dl-client.getdropbox.com/u/5822/firefox.tiff

Appearance in IE6: http://dl-client.getdropbox.com/u/5822/ie6.tiff

Live site: Motolistr.com

The following CSS works great in FF and Safari, but doesn't in IE6.

border:1px solid #d13a3b;

The following CSS DOES WORK in IE6, and it seems identical...(wtf)

border:1px solid #d13a3b;

Also, my link/span button doesn't appear either- I assume this is the same type of issue.

a.button {
    background: transparent url('../images/nav/button_bg_right4.gif') no-repeat scroll top right;
    color: #000;
    display: block;
    float: left;
    font: normal 18px arial, sans-serif;
    height: 36px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;

a.button span {
    background: transparent url('../images/nav/button_bg4.gif') no-repeat;
    display: block;
    line-height: 24px;
    padding: 5px 0 7px 18px;

Any ideas?

Thanks, Nick

Seems like this one's been pretty well answered, but I'd like to add:

Works in IE:

background:transparent url('../images/nav/button_bg4.gif') no-repeat;

Works in Firefox and Chrome but does not work in IE:

background:transparent url('../images/nav/button_bg4.gif')no-repeat;

Without knowing IE needs that space (which seems like very marginal formatting) you can waste seeerious time, non?