jeudi 30 juin 2016

Setting submit form button with a background image?

i'm simply trying to set a background image to my submit button in my form. I've tried a couple variations of methods but every time I get the default browser button. Anyone know where I'm going wrong here?

HTML

<div id="headerSearch">
    <form method="post" action="Test.php">
        <div id="headerSearchBar">
            <input class="tbSearch" type="text" name="search" size="12" placeholder="Search...">
        </div>
        <div id="headerSearchBtn">
            <input class="btnSearch" id="button" name="submit" type="submit" value="">
        </div>
    </form>
</div>

CSS

#headerSearch{
    float:right;    
    width:80%;
    height:80px;
}
#headerSearchBar{
    float:left;
    width:90%;
    height:80px;

}
.tbSearch{
    height:25px;
    width:95%;
    margin-top:27.5px;
    margin-left:2%;
    margin-right:0;
    margin-bottom:0
}
#headerSearchBtn{
    float:right;
    width:10%;
    height:80px;
    text-align:center;
}
.btnSearch{
    background-image:url(../IMAGES/btnSearch.svg) no-repeat;
    width:25px;
    height:25px;
    margin-top:27.5px;
}

Aucun commentaire:

Enregistrer un commentaire