Remove search button image & Add only css text

[crazie21]

What i'm asking is how do i change the submit search button to css text only, So i can custom the hover over color & also so the text can be sharper.

 

I've not found any posts on this subject on removing the image & creating the box with border & text inside of it through css only, no image.... What im striving to achieve is a search button like amazon's

 

Thank you for reading & If you do post something that helps, Future thanks in advance

Edited March 28, 2014 by crazie21 (see edit history)

[dioniz]

In blocksearch.css find:

#search_block_top .btn.button-search span {
    display:none;
}

and remove display:none; to show search text.

 

Then find

#search_block_top .btn.button-search:before {
    content: "";
    display: block;
    font-family: "FontAwesome";
    font-size: 16px;
    text-align: center;
    width: 100%;
}

and remove it to get rid of search icon.

[crazie21]

In blocksearch.css find:

#search_block_top .btn.button-search span {
    display:none;
}

and remove display:none; to show search text.

 

Then find

#search_block_top .btn.button-search:before {
    content: "";
    display: block;
    font-family: "FontAwesome";
    font-size: 16px;
    text-align: center;
    width: 100%;
}

and remove it to get rid of search icon.

 

the block search is part of the defult prestashop theme , im using blocksearch_mod.css

 

tryed finding the code in the blocksearch_mod.css but couldnt find

 

Edit, There is no display: none; line

Edited March 28, 2014 by crazie21 (see edit history)

[crazie21]

 Can someone help :/

Edited March 28, 2014 by crazie21 (see edit history)

[crazie21]

Bump