Question

I have this menu:

<div id="menu-home">
    <ul>
        <li> a </li>
    </ul>
</div>

When I am on the test.php page that corresponds to test menu, I need it’s li to have a different style..

I tried

#menu-home ul li:active 

but it didn’t work..

Thanks

Answer 1

There is no :active state for <li>

Instead you can do it with PHP.

<div id="menu-home">
<ul>
<li <?php if (page is current page) echo ' class="active"';?>> a </li>
</ul>
</div>

And in the CSS, you can give this:

#menu-home ul li.active {}