css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
user profile image

CSS Sliding menu with scroll, no JS were used


  1. Cool, I really like this. Font Awesome looks great. I might try and scroll and activate on-click instead of hover for touch screens.

  2. Thank you for the suggestions Taylor! I will try to implement scroll; it's definitely a must have function for any adaptive design.

  3. This is really awesome! It definitely gives me an idea or two for a place to start with a new menu for my own site. I did notice what may be considered a glitch, though. I'm using Chrome on my laptop, and i noticed that if you tab through nothing happens when any of the links get :active status. But that's not it... like when it tabs through the social media links it shifts those links partially into view, but even once the list expands with :hover, the whole thing is shifted out of frame to the left. You have to reload to get it back to normal. Even with that, it's still a gorgeous design! :D

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.