Search Options
close
Search the following clips:
All Clips
Everyone's Clips
My Guides
Sign Up
Install
Learn More
Login
14 free vertical CSS menus
ericskiff
follow
17
11-20-2006 1:13 PM
5215 views
tags:
css
,
menu
,
navmenu
,
web
,
development
ericskiff
says:
Sometimes it's better not to bother reinventing the wheel.
Here's some great CSS menu designs to give a solid navigation element to your site using only ul and li in the html.
1 Comment
|
Add a Comment
11-22-2006
1:48 AM
cbarr
Thanks for visiting my clips. And thanks for commenting.
Login
to Comment. Not a member yet?
Sign up
Related Clips
Cheat Sheet Roundup - Over 30 Cheatsheets ...
Createblog
CSS for Dynamic Data Table Presentation
30 Websites to follow if you’re into Web D...
What Would Jesus Do?
10 Signs you've been using Firefox too long
Free Web Bulding-This I Like
More clips from
ericskiff
Hank's Bailout as Nigerian Spam
Oil jumps $25!
T-shirt: Hey Hank... Where's my bailout?
Today's Top Clips
DNA could reveal your surname
Holographic television to become reality
Rednecks for Obama
Eye Colour
Scientists adapt economics theory to trace brain's information flow
Risk and reward compete in brain
Street lamps powered by discarded batteries light the neighborhood for cheap
Even When You Sleep, Your Brain Is Awake
Investigation Ties Palin to 'Extreme Right-Wing Fringe'
McCain Goes After Michelle ...
visit the
Top Clips page
View the Top Clips from
November 20, 2006
Embed This Clip In Your Site...
<div style="margin: 12px 0px; font-family: arial; color: #333333; background: #ffffff; border: solid 4px #e5e5e5; width: 100%; clear: left;"><div class="CM_CTB_Content_Wrap" style="margin: 0px; padding: 0px;background-color: #ffffff;"><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content.clipmarks.com/blog_embed/3b350ab3-d593-4283-a557-bbfaf9af86ef/C3BB8583-C633-4DF9-AF84-02079F1E11FD/" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.exploding-boy.com/2005/12/29/14-free-vertical-css-menus/" href="http://www.exploding-boy.com/2005/12/29/14-free-vertical-css-menus/" style="font-size: 11px;">www.exploding-boy.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2005/12/29/14-free-vertical-css-menus/"><P>After receiving several email requests from visitors asking for vertical menus I decided to create <A href="http://exploding-boy.com/images/EBmenus/menus.html">14 free vertical menu designs</A>. You may <A href="http://exploding-boy.com/images/EBmenus.zip">download the entire set</A> and use any way you see fit. Like the last <A href="http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/">two</A> <A href="http://www.exploding-boy.com/2005/12/21/more-free-css-navigation-menu-designs/">sets</A> of menus these can be used for commercial or private use. Have fun with all the menus.</P></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2005/12/29/14-free-vertical-css-menus/"><P><A href="http://www.exploding-boy.com/images/EBmenus/menus.html">See all the menus</A>. <A href="http://www.exploding-boy.com/images/EBmenus.zip">Download the entire menu set</A>.</P></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2005/12/29/14-free-vertical-css-menus/"><P>Be sure to check out <A href="http://e-lusion.com/design/menu/" title="e-lusion.com">E-lusion.com</A> for <STRIKE>more</STRIKE> better menu design examples. </P></blockquote><div style="height: 2px; font-size: 2px; background: #dcdcdc; border-bottom: solid 1px #f5f5f5; margin: 2px 4px;"></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2005/12/29/14-free-vertical-css-menus/"><H4>Related Entries</H4></blockquote><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content7.clipmarks.com/images/clip-icon.gif" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.exploding-boy.com/2006/01/16/4-level-deep-css-menus/" href="http://www.exploding-boy.com/2006/01/16/4-level-deep-css-menus/" style="font-size: 11px;">www.exploding-boy.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2006/01/16/4-level-deep-css-menus/"><li style="margin-left:16px;padding-left: 0px;"><A title="Permanent%20Link:%204%20Level%20Deep%20CSS%20Menus" rel="bookmark" href="http://www.exploding-boy.com/2006/01/16/4-level-deep-css-menus/">4 Level Deep CSS Menus</A></LI></blockquote><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content8.clipmarks.com/images/clip-icon.gif" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.exploding-boy.com/2005/12/21/more-free-css-navigation-menu-designs/" href="http://www.exploding-boy.com/2005/12/21/more-free-css-navigation-menu-designs/" style="font-size: 11px;">www.exploding-boy.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2005/12/21/more-free-css-navigation-menu-designs/"><li style="margin-left:16px;padding-left: 0px;"><A title="Permanent%20Link:%20More%20Free%20CSS%20Navigation%20Menu%20Designs" rel="bookmark" href="http://www.exploding-boy.com/2005/12/21/more-free-css-navigation-menu-designs/">More Free CSS Navigation Menu Designs</A></LI></blockquote><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content9.clipmarks.com/images/clip-icon.gif" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/" href="http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/" style="font-size: 11px;">www.exploding-boy.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/"><li style="margin-left:16px;padding-left: 0px;"><A title="Permanent%20Link:%20Free%20CSS%20Navigation%20Menu%20Designs" rel="bookmark" href="http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/">Free CSS Navigation Menu Designs</A></LI></blockquote><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content6.clipmarks.com/images/clip-icon.gif" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.exploding-boy.com/2006/11/02/updated-centered-sliding-doors-menus/" href="http://www.exploding-boy.com/2006/11/02/updated-centered-sliding-doors-menus/" style="font-size: 11px;">www.exploding-boy.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2006/11/02/updated-centered-sliding-doors-menus/"><li style="margin-left:16px;padding-left: 0px;"><A title="Permanent%20Link:%20Updated%20Centered%20Sliding%20Doors%20Menus" rel="bookmark" href="http://www.exploding-boy.com/2006/11/02/updated-centered-sliding-doors-menus/">Updated Centered Sliding Doors Menus</A></LI></blockquote><div style="border-bottom: solid 1px #dcdcdc; white-space: nowrap; margin-bottom: 8px; background-color: #eeeeee ;background-image: url(http://www.clipmarks.com/images/source-bg.gif); background-repeat: repeat-x; height: 24px; line-height: 24px; vertical-align: middle; padding-bottom: 4px; color: #666666; font-size: 10px;" ><a href="http://clipmarks.com/clip-to-blog/" title="see clips that are hot right now"><img src="http://content7.clipmarks.com/images/clip-icon.gif" alt="" width="19" height="19" border="0" style="vertical-align: middle; margin: 0px 4px; display: inline; border: none; float:none;" /></a>clipped from <a title="http://www.exploding-boy.com/2006/01/04/css-templates-and-samples/" href="http://www.exploding-boy.com/2006/01/04/css-templates-and-samples/" style="font-size: 11px;">www.exploding-boy.com</a></div><blockquote style="text-align: left; padding: 0px 8px; margin: 4px 0px 8px 0px; background: transparent; border: none;" cite="http://www.exploding-boy.com/2006/01/04/css-templates-and-samples/"><li style="margin-left:16px;padding-left: 0px;"><A title="Permanent%20Link:%20CSS%20Templates%20and%20Samples" rel="bookmark" href="http://www.exploding-boy.com/2006/01/04/css-templates-and-samples/">CSS Templates and Samples</A></LI></blockquote></div><div style="margin: 0px 6px 6px 4px;"><table style="font-size: 11px;border-spacing: 0px;padding: 0px;" cellpadding="0" cellspacing="0" width="100%"><tr><td style="background:transparent;border-width:0px;padding:0px;"> </td><td align="right" style="background:transparent;border-width:0px;padding:0px;width:107px" width="107"><a href="http://clipmarks.com/share/C3BB8583-C633-4DF9-AF84-02079F1E11FD/blog/" title="blog or email this clip"><img src="http://content8.clipmarks.com/images/c2b-foot.png" border="0" alt="blog it" width="107" height="17" style="border-width:0px;padding:0px;margin:0px;" /></a></td></tr></table></div></div>
Clipmarks
Home
New Clips
Top Clips
Dashboard
Popular Topics
News
Life
Science
Technology
Entertainment
Get Started
Sign Up
Install Clipping Tool
How Clipping Works
Clip-to-Blog™
ClipSearch
Tools and Resources
FAQ
ClipWeek
Top Clippers
Top Tags
Site Map
About Clipmarks
About Us
Contact
Blog
Copyright
Privacy
EULA
OK