Underline Active Navigation and On Hover

Hello,

I'm trying to have the text transform to underline in the main navigation (at the top), as well as on hover. Working in Pacific. The text color changes on hover and active currently, but would like to underline as well. Tried to work with the .active-link command, but didn't get far.

my site: s2corporation.squarespace.com

Any help on this would be awesome!

Go to your site menu and click on Settings, then click on Advanced, then Code Injection. In the Header section, enter the following, then click Save. Adding the code here, rather than on the page settings, will ensure the CSS is applied site-wide:

<style>
#header a:active{
 text-decoration: underline !important;
}

#header a:hover{
 text-decoration: underline !important;
}

div.folder.active{
 text-decoration: underline !important;
}

</style>

This will take care of underlining the active folder, and will also underline subnav items as you hover over them. Is this what you needed?

Awesome. That did the trick almost perfect. The folder and hover code works great (I styled the folder one with a color: red; function), but the active link code isn't working for me. Any ideas? Thanks!!

I just looked at your site, and it looks like the active link styling is working for all but your home link (The Spectrum). Try adding this to the code injection:

div.index.home.active {
text-decoration: underline !important;
}

I may have had the underline code disabled momentarily while I was working on some css. Tried that code, and still no go. It's weird that it's just the active link that doesn't show up underlined.Thanks for all the help though!