Как сделать кнопку при наведении которой она будет менять картинку?

[Zerro76]

Вобщем есть две картинки button.png(просто фон кнопки) и hbutton.png(фон при наведении).Создал в css класс nav и написал еще два

a.nav {background: url(../images/button.png) repeat-x 0px 1px ; width:100% ; height:46px ; margin:auto ;text-decoration: none;}
a.nav:hover {background: url(../images/hbutton.png) repeat-x ;font-size:15px;color: #000;}

А в html сделал так

<div class="nav">
<table>
 <td><div style="padding: 10px 15px 5px;font-size:15px;"><a href="/" class="nav"><span>Главная</span></td></div>
 <td><div style="padding: 10px 15px 5px;font-size:15px;"><a href="/" class="nav"><span>Файлы</span></td></div>
</table>
</div>

Вопрос собсвтенно в чем , полчилось так , то фон находиться только позади букв , короче вот

Строго не судите по коду) т.к. только начал осваивать

А да кстати вот сам класс nav

.nav {background: url(../images/nav.png) no-repeat 0px 0px; width:1000px; height:50px ; margin:auto ; }

Edited February 28, 2012 by Zerro76

[Softlink]

http://htmlbook.ru/faq/kak-sdelat-chtoby-kartinka-menyalas-pri-navedenii-na-nee

p.s. ссылка битая

[Zerro76]

http://htmlbook.ru/faq/kak-sdelat-chtoby-kartinka-menyalas-pri-navedenii-na-nee

p.s. ссылка битая

А написать потом поверх этой картинки можно будет?)

[Softlink]

http://htmlbook.ru/faq/kak-sdelat-chtoby-kartinka-menyalas-pri-navedenii-na-nee

p.s. ссылка битая

А написать потом поверх этой картинки можно будет?)

Да, т.к. рисунок у кнопки в фоне.

[Zerro76]

Вобщем сделал , почти , получилось так

Как мне сдвинуть текст ? Пробую добавить в html это

<td><div style="padding-top:5px;"><a href="/" class="nav"><span>Главная</span></div></a></td>

Сдвигается картинка

____________________________________________________________________________________________________________

Пробовал добавить в css класс ".nav td"

.nav td {padding:2px 2px 2px 2px;}

и добавить потом в html к td

<td class="nav"><div style="padding-top:5px;"><a href="/" class="nav"><span>Главная</span></div></a></td>

Но так вообще картинка тянется и получается нечто

...Что сделал не так ?)

Edited February 28, 2012 by Zerro76

[Zerro76]

Вобщем все ,вопрос решен , пошаманил что-то сделал )) спасибо огромное Softlink .