CSS Library Horizontal CSS Menus
Welcome to Dynamic Drive's new CSS library! Here you'll find original, practical CSS codes and examples such as CSS menus to give your site a visual boast.
Overlapping horizontal tabs
Using relative positioning and negative margins, this CSS code creates "overlapping" horizontal tabs that each snug up and slightly overlaps the tab to the left of it. A nice visual look.
SuckerTree Horizontal Menu
SuckerTree Horizontal Menu is a CSS and DOM hybrid menu that's list based and supports multiple levels of sub menus.
Sleek Pointer Menu 2
This is an alternate version of the original Sleek Pointer Menu, one with a more trimmed down interface and with an arrow background that appears only when the mouse moves over a menu item.
Half moon tab menu
We named this CSS tab menu "Half Moon" based on its look. The menu uses a transparent background image for each tab item to create a right round edge. Easy customization of menu colors and alignment.
DD Color Tabs II
Based on the same design as DD Colors Tabs, this second version flips the tabs over to create an inverted look. Just like the original, you can modify the menu's default and hover colors just by altering the two color values inside the CSS code. This is made possible thanks to transparent images used as the menu tabs' interface.
Plastic Tabs menu
This is a no frills, "plastic looking" tabs menu. The entire menu can be aligned either to the left or right of the page, by setting the menu's float attribute accordingly.
Sleek Pointer Menu
An inverted, round corner CSS menu bar with a cut-out pointer below each menu link. The pointer is simply a transparent background image, automatically adopting to any background colors (in this case, black and darkred).