Jump to content

PatrickC

Member
  • Posts

    3
  • Joined

  • Last visited

Posts posted by PatrickC

  1. I am trying to make an animated underline on hover. would be nice if the underline remained for the active page. I found this but the underline is miles away from the navigation and does not stay on for the active page..... Anybody have any suggestions? Much appreciated..

    .Header-nav-item { position:relative; height: 60px; line-height: 60px; text-align: center; transition: 0.5s; padding: 0 20px; cursor: pointer; -webkit-transition:0.5s;} .Header-nav-item:hover { background-color: transparent; border-color: transparent; color: #000000;} .Header-nav-item:hover:before{ transition-delay: .2s; } .Header-nav-item:before{ width: 0%; height:100%; z-index: 3; content:''; position: absolute; bottom:-1px; left:0; box-sizing: border-box; transition: .2s;} .Header-nav-item:hover:before { width: 100% !important; transition: .7s; } .Header-nav-item:before { border-bottom: 2px solid #000000;}

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.