Five Free CSS Sliding Door Tab Menus

Five Free CSS Sliding Door Tab Menus

Making use of last years free Web 2.0 buttons I’ve produced a collection of five free complete CSS tab menus, making use of the sliding doors technique which allows the tabs to expand horizontally depending on the length of the contained text.

Take your pick of Black, Blue, Green, Grey or Red, with each menu being available to download as a zip file containing the relevant files. Open the html file into an editor or view the source and copy the CSS code and unordered list into your own documents, then replace the textual content from within the list items with your personal menu titles.

The menus have been tested and appear to work without issue in Firefox, IE7, IE6, Opera and Safari.

Like This Post? - Sharing & donating are great ways to say Thanks!

This entry was posted on Saturday, May 3rd, 2008 at 10:44 am and is filed under Vector Freebies and Resources. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

« Wrapping Text Around an Image in Illustrator

6 Responses to “Five Free CSS Sliding Door Tab Menus”

  1. » Five Free CSS Sliding Door Tab Menus | Blog.SpoonGraphics Webcreatives Says:
    May 3rd, 2008 at 2:29 pm

    [...] Five Free CSS Sliding Door Tab Menus Related StuffUsing CSS and Mootools to simulate Flash horizontal navigation effectClean Tab Bar Digg-like using CSSIzzyMenu - Create your professional CSS/DHTML Menu in a minute!37+ Great Ajax, CSS Tab-Based InterfacesDesign Watercolor Effect Menu23 Resources for Clean and Compressed CSSHomer Simpson CSS Level the Playing Field with Reset Style Sheets4 Uber Cool Css Techniques For Links30 Exceptional CSS Techniques and Examples [...]

  2. Nout van Deijck - Blog Says:
    May 3rd, 2008 at 3:41 pm

    Very cool!
    Nice menus!


    Nout van Deijck - Blog

  3. website design Says:
    May 5th, 2008 at 8:44 am

    Too much elements inside the list. There is no need of “spans” :)

  4. Chris Says:
    May 5th, 2008 at 10:10 am

    I originally produced a menu without the span tags, by using the :hover pseudo class on the actual list item. Unfortunately this isn’t supported by IE6 so the span tags have to come out to play to solve this. :-)

    At least the future of CSS3 will allow for an even better solution with multiple backgrounds!

    Chris

  5. Blue Buffalo Says:
    May 5th, 2008 at 1:50 pm

    Cool! Clean and easy to use CSS tab menus. Thanks.

  6. André Gärtner Says:
    May 8th, 2008 at 7:36 pm

    good work!

Leave a Reply