html - How do I complete this Vertical Navigation bar with rollover images?

Question

I would like to have a vertical navigation bar with these images. I seem to have gotten the rollover change in place but am not sure what I need to do to get the menu to display correctly.

http://www.charissasantos.la/mezcaleria.html

Answer 1

I'm not sure if I have this right, but it looks like you are trying to use padding to push the text out of the link so that only the background image shows. Instead of padding, try using a negative text-indent. Like this:

#subnav ul li a {
    background-image: url("img/img-bg-subnav-mezcal.png");
    display: block;
    height: 1px;
    text-indent: -9999px;
}