Need someone to lead product management at your software company? I create software for people that create software and I'm looking for my next opportunity. Check out my resume and get in touch.

Adam Kalsey

This is the blog of Adam Kalsey. Unusual depth and complexity. Rich, full body with a hint of nutty earthiness.

User Experience

CSS tabs with Submenus

Freshness Warning
This blog post is over 21 years old. It's possible that the information you read below isn't current and the links no longer work.

15 May 2003

There’s lots of talk recently about creating tabbed menus with CSS, but very little about associating submenus to the tabs. Joshua Kaufman and Richard Rutter have done it, but their methods require the creation of separate unordered lists that are only associated with the parent menu by the CSS. If you view the page without the stylesheet — with a screen reader for example — the navigation is confusing and impossible to decipher.

I created a method of adding submenus to your tabbed navigation in which the submenu lists are nested into the parent navigation list list. So anyone not using CSS will see a menu that looks like…

  • Home
  • About Us
    • People
    • Careers
    • …
  • Contact Us
  • …

… and everyone else will see a tabbed menu like …

Screen capture of CSS tabs

I’ve put up a demo page for your enjoyment.

Update: I forgot to mention: please feel free to use the code and mangle or adapt it as needed. If you use it would be nice if you’d tell me where. I’m just curious where it ends up.

Recently Written

Video calls using a networked camera (Sep 25)
A writeup of my network-powered conference call camera setup.
Roadmap Outcomes, not Features (Sep 4)
Drive success by roadmapping the outcomes you'll create instead of the features you'll deliver.
Different roadmaps for different folks (Sep 2)
The key to effective roadmapping? Different views for different needs.
Micromanaging and competence (Jul 2)
Providing feedback or instruction can be seen as micromanagement unless you provide context.
My productivity operating system (Jun 24)
A framework for super-charging productivity on the things that matter.
Great product managers own the outcomes (May 14)
Being a product manager means never having to say, "that's not my job."
Too Big To Fail (Apr 9)
When a company piles resources on a new product idea, it doesn't have room to fail. But failing is an important part of innovation. If you can't let it fail, it can't succeed.
Go small (Apr 4)
The strengths of a large organization are the opposite of what makes innovation work. Starting something new requires that you start with a small team.

Older...

What I'm Reading