Active menu state behind default menu state

[willbo987]

Hi there.

I am quite new to Joomla and would call myself a hobby man when it comes to HTML.

I have taken a template I purchased and am editing it.

I am dealing with the Main menu items at the top of my page:
http://www.tumblingtigers.co.uk/tigers/ ... p/about-me

I am trying to get the ACTIVE menu item background above the normal item. As seen on my site currently the normal background image (black paw) is overlaying the active item (green circle).

I have notice that the menu items in the CSS are based on "#navigation a" and "navigation a:hover" BUT the active background item is based on "'navigation li.active"

I have tried using "navigation a.active" and "navigation a:active" but does not work.

Can someone help

Will

PS. the CSS code is based as http://www.tumblingtigers.co.uk/tigers/ ... defaut.css

[willbo987]

Sorry,

Link to the site is:
http://www.tumblingtigers.co.uk/tige...x.php/about-me


Link to the CSS is:
http://www.tumblingtigers.co.uk/tige...ss/tdefaut.css

[Dava1986]

your problem seems a bit easy

find

#navigation li.active {

Replace with

#navigation li.active a{

that should sort the problem and allow you to set a current icon for that link

[ssystems]

your problem seems a bit easy

find

#navigation li.active {

Replace with

#navigation li.active a{

that should sort the problem and allow you to set a current icon for that link

Shouldn't it be

#navigation li:hover

Haven't tried but the image is on the list-item element not in anchor

[willbo987]

Hi Dava1986 and ssystems.

Davas solution worked.

When using Joomla, it uses the .active to refer to the current page that your on.

It just confused me as to why all the states were set on #navigation a:hover etc although this particular was set on #navigation li.active.


But changing it to:

#navigation li.active a{ WORKED!!!.

Thanks again

Will