user profile image

A tab-to-menu layout that doesn't use javascript. Modern browser compatible.


  1. S. B. @CunningFatalist on

    Clever, I like it :)

  2. Cool and Clever :D Included on my list (Here)

  3. Great demo!

  4. You're my favorite new person to follow. I've done some junk like this, but less good. Steps: http://codepen.io/Keale2/pen/PqvxQg Idea for toggling themes without JS: http://codepen.io/Keale2/pen/VLxYNm

  5. @Keale2 ha! thanks.

    I like your approach in the steps one. Being able to use + in your selector with your HTML structure really cleans up the CSS. Unfortunately, if you need to conditionally style any other elements that precede any of them you're screwed and thats when things gets complicated/out of control/borderline impractical (ie this pen).

    We're going to have a lot more freedom with CSS4 though.

    Also, if you haven't seen it already, I have a slew of other pens like this in my No JS Collection

  6. My favorite thing about Codepen is finding clever (and useful) ways of doing things in code - and not just seeing things people spent an impressive amount of time on (like making cartoons with CSS). I'll definitely check out that Collection, and hopefully I'll be inspired to do some crazy things with my CSS.

  7. Cool ! The responsive part is so clever, i fall in love with this tabs :)

  8. @jakealbaugh
    Hi. Is there a way to support Internet Explorer 11?

  9. Very great I would like to use this code. I want to know how to directly link to a specific tab from another page I am a beginner so I do not know what to do. please tell me

  10. Nice and useful!

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

You must be logged in to comment.