A Pen by Charlie Cathcart on CodePen.
Created
June 20, 2017 13:25
-
-
Save pixelchar/2e8811a4b5fa1d1ea48845ba7f1957a0 to your computer and use it in GitHub Desktop.
SGK Quick Nav
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="wrapper"> | |
| <ul id="skg-side-nav"> | |
| <li class="active"><a href="">Get Involved</a></li> | |
| <li><a href="">Register</a></li> | |
| <li><a href="">Donate</a></li> | |
| <li><a href="">Sponsor</a></li> | |
| <li><a href="">Volunteer</a></li> | |
| </ul> | |
| </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .wrapper { | |
| margin: 1em auto; | |
| max-width: 300px; | |
| border: 1px solid #ddd; | |
| } | |
| #skg-side-nav { | |
| margin-left: 0; | |
| padding-left: 0; | |
| list-style: none; | |
| } | |
| #skg-side-nav a { | |
| text-decoration: none; | |
| color: #EA77AF; | |
| } | |
| #skg-side-nav li { | |
| margin-bottom: .5em; | |
| padding: .5em; | |
| } | |
| #skg-side-nav li:hover { | |
| background-color: #FDF0F7; | |
| } | |
| #skg-side-nav li.active { | |
| background-color: #EA77AF; | |
| } | |
| #skg-side-nav li.active a { | |
| color: #ffffff; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
working fine