Question

So im trying to style a submit button. The background comes from a transparent png sprite file.
When all is said and done the button appears as a white box, and the sprite image isnt loaded.

<input name="Submit" type="submit" value="" class="lp-submit"/>

CSS

.lp-submit {
    vertical-align:middle;
    width:106px; 
    height:47px; 
    background:transparent url(images/bt_sprite.png) no-repeat 0 0;
    border:none;
    cursor:pointer;
}

.lp-submit:hover {
        background:transparent url(images/bt-sprite.png) no-repeat 0 25;
}

The image shows up if “transparent is removed from background:. When its put back in its a white box again.

Answer 1

Check the relative path to your image. CSS looks for relative paths from the folder it is in, not from the document root. And why there is to slashes?