Top menu underline text

Hi
Im trying to underline the top menu text via css. I want the line to be right below the top menu text, not in the bottom of the field. I made the line 80% width and tried to place it in the center.

.avia-menu-fx {
height: 1px;
bottom: 30px;
width:80%;
left:10%;
}
The left10% is probably wrong also, tried align center with no luck.

Everything works fine until I scroll down and the menu gets smaller – which moves the line.
(Bot the selected menu item and rollover works perfect until I scroll down the page)
Probably I have used the wrong css class.

Any help on this would be great

Thanks

• This topic was modified 10 years, 6 months ago by Condesign_kista.