How do I use an IMAGE for the main menu and BLOCK for sub menu items

Question

I have used images for my main menu items and cascading block for the sub items.  The main menu items show the images I want, but with the colour block behind them, which I don't want.  How do I make the block on the main menu invisible, or remove it completely, without it affecting the sub menu colours and hovers?

KMacL · Accepted Answer

I worked it out, thank you! I removed the colour and border from the navbar anchor and put it in the submenu anchors instead. Always the obvious! Thank you for your help.

Nancy OShea · Answer

Just so you know, image based navigation is awkward for several reasons.

#1 When you edit your site, you must create all new menu images each time. After doing this 3 or 4 times, you'll soon grow to hate your menus and stop updating them.

#2 Image based menus are not web friendly.

- They cannot be indexed by search engines.

- They cannot be translated.

- They often look very blurry/pixelated on hi density devices.

In the long run, it's much easier for everyone if you use real text for menus and style them to look like buttons or whatever with custom CSS code.

Nancy

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded