The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Custom Underline for a:hover

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #43119

    Hi everyone!

    I’ve been trying out a few tutorials and adapting a few snippets to try and make this work, but I still haven’t been able to figure this out.

    I’m trying to have a 23px x 1px dash when hovering over links in the navigation. Here is what I’m aiming for:

    [Mockup]( “Mockup”)

    Here’s my code so far:


    nav {
    display: inline-block;
    padding-bottom: 10px;

    nav.nav1 {
    text-align: right;
    margin-right: 3em;
    margin-top: -.6em;

    nav.nav1 li {
    float: right;
    margin-left: 4em;
    Any help will be awesome!


    Thanks so much! Oops, the span was a remnant from a last trial.

    And, sorry, I should just be styling the nav directly, and not with h1 yes?


    Thanks a lot for the help. Just starting out and trying to code my portfolio, so this will be fun.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.