Menu icon Foundation
How to add underline to links in top-bar?

Hi everybody.

Does anybody know of a way to add a line under the active link (and hover state) in the top-bar?
Like in the attached example.

I've solved this by wrapping the text between the A tag in an extra SPAN tag with a class that adds the underline.

Just wondering if there's a better way of doing this?

Swgraphic

top-barunderlinenavigation

Hi everybody.

Does anybody know of a way to add a line under the active link (and hover state) in the top-bar?
Like in the attached example.

I've solved this by wrapping the text between the A tag in an extra SPAN tag with a class that adds the underline.

Just wondering if there's a better way of doing this?

Swgraphic
Rafi Benkual over 5 years ago

You can add it to the dropdown like this:

body .contain-to-grid nav.top-bar li.has-dropdown ul {
border-top: solid 0.4rem #CE0037;
}

or like this http://cdpn.io/cfxyr