Loading ..................

Responsive Accordian to Tabs


Single breakpoint


  1. accordion
  2. tabs


  1. If I try to use the tabs in FF (Mac) the tabs vanish. Is this a problem with your JS or a general Codepen-problem? I recognized, that Codepen has its flaws in Firefox, unfortunately.

  2. @jensgro Fixed that issue. Wasn't passing in the event to the click event callback properly.

  3. Chris, You rock! CSS-tricks.com has been a godsend to me.

  4. @chriscoyier I will not be happy with myself until I write CSS and JS that is as elegant and organized as this.

  5. Thanks very much for this @chriscoyier I'm not a smart man, it took me a little while to realize why it didn't look the same when I used a small unordered list in place of the paragraph. I added width 100% to .nav section.is-open to keep the containers equal size. Very cool how it's set up with flexible widths from the start. Thanks again.

Leave a Comment Markdown supported. Double-click names to add to comment.

You must be logged in to comment.
  • 65 Hearts