CSS for href Not Working as Expected

[KateMacwil]

Hi

I have created styles for my menu which aren't working as expected.

I have attached a small portion of my page so you can see where I have referenced my menu class in the menu links.
Although you can't see the call to my style sheet, it is in my original code.

The menu links turn white on load and when I hover over the menu item, the underline works. However the active link
is not working.

 

 

tender-options.php

styles.css

Edited May 15, 2018 by KateMacwil
typos

[dsonesuk]

For the active to work you need to click on the link, but you have identical styling for hover? So how will you see the active take effect, when it is already that effect for hover?

Only place css for those styles that change within each specific pseudo class.

            .table-setup-menu
            {
                background-color: #0c6bb5;
                margin: 0px;
                padding: 3px;
                width: 800px;
                border: 1px solid #0c6bb5;
                border-radius: 25px;
            }

            a.tender-menu-item {color: #FFFFFF;font-weight: bold;font-size: 16px;}

            a.tender-menu-item:link, a.tender-menu-item:visited
            {
                text-decoration: none;
            }

            a.tender-menu-item:hover, a.tender-menu-item:active
            {
                text-decoration: underline;
            }

            a.tender-menu-item:active
            {
                color: lime;
            }

Also! you should never use a table for a menu, its not structured to be responsive for smaller devices.

Edited May 15, 2018 by dsonesuk

[KateMacwil]

Thank you!

I will swap out the table to a div