Question

I am working on this : Menu List

What I am trying to do is check with yourselves, If my approach is the right way. The site is running on WordPress.

So ideally I’d like to get rid of the text “Our Services, About Us” etc.. But I’d also like the graphic to become a clickable anchor link.

Has anyone any ideas on the best way to approach this?

Thanks in advance.

Answer 1

Give image inside anchor. Write like this:

.menu-header ul li a{
    display:block;
    padding: 70px 55px;
    text-indent:-9999px;
}

#access .menu-header ul li#menu-item-26 a{
    background: url(http://i41.tinypic.com/345h0cw.png) no-repeat;    
}

#access .menu-header ul li#menu-item-24 a{
    background: url(http://i43.tinypic.com/15cikhs.jpg) no-repeat;
}

#access .menu-header ul li#menu-item-23 a{
    background: url(http://i39.tinypic.com/dca82q.png) no-repeat;
}

Check this http://jsfiddle.net/FN6f5/2/