CSS Tabs 2.0
My goal was to build CSS tabs without using any images or hacks and with as little CSS as possible.
See CSS Tabs in action. (View source for HTML and CSS.)
(Updated 10 February 2007) CSS Tabs has been tested in:
- Windows
- Internet Explorer (6.0, 7.0)
- Mozilla (1.1, 1.2, 1.3, 1.4, 1.5, 1.6)
- Firefox (1, 1.5, 2.0)
- Opera (8.5, 9.0)
- Netscape (6.2, 7.2)
- Mac
- Safari (1, 1.1, 1.2, 1.3, 2.0)
- Camino (0.7, 0.8, 0.9, 1.0)
- Opera (8.5, 9.0)
- Mozilla (1.1, 1.4, 1.5, 1.6, 1.7)
- Firefox (1.0, 1.5, 2.0)
- Netscape (7.0, 7.2)
- Linux
- Firefox (1.5, 2.0)
- Konqueror 3.40
- Mozilla (1.1, 1.3, 1.4, 1.5, 1.6, 1.7)
- Opera 9.0
- Netscape 7.0
- They don’t use any images.
- They don’t use any CSS or HTML hacks.
- They use very little CSS.
- They can be placed anywhere on a page.
- The HTML doesn’t need to change between pages because the CSS uses the
bodyid to determine the active tab.
Please note: I’m no longer working on CSS Tabs. Your feedback is appreciated, but I won’t update the HTML or CSS. If you have problems using CSS Tabs, please consult one of the many CSS Tutorials available.
Related blog posts: