[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now


CSS Drop downs with dynamic width sub-menus

Posted on 2007-07-23
Medium Priority
Last Modified: 2012-05-05

i'm trying to create a drop down menu using CSS... well, not create one but tweak one of the fine ones already available....

the one i'm currently trying to work with can be found here... http://www.cssplay.co.uk/menus/simple_vertical.html

my problem is that in this menu system , and with an Adobe Spry menu system in DW CS3 which uses a similar <li> system to set up data, is that the sub-levels always seem to be of the same size... if the text in the menu overuns this size all kinds of weirdness start happening (eg it goes to 2 lines and covers the menu underneath etc)... i can provide examples if that would help...

so basically i'd like to find a CSS based dropdown menu where the data is in a nice to understand format (eg. HTML lists) but where the submenus' width expands according to the size of the text contained...

for reference the reason i need this is that i'd like to create a dynamic drop down which will take its info from a database... and you never know how much text is going to end up in one of these menus...


Question by:dog_star
  • 3
  • 2
LVL 12

Expert Comment

ID: 19551759
Hello dog_star,

I do not know if it is 'deep' enough for your needs (& assuming you did not notice ti), there is a variable width css drop down menu at cssplay...


I hope this helps!



Author Comment

ID: 19551829
well, i did miss that and it will come in handy in some sites i build, but i really need sub-menus too....

nice find though :)

Accepted Solution

trinzia earned 2000 total points
ID: 19551901
There's one here,  List-Based Dhtml Menu.  I did not study it in depth, but I was able to add a really long menu item.  
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Author Comment

ID: 19565103
thanks for the link trinzia but unfortunatly this appears to use a complex javascript for the data....

 what i need is something CSS based so the menu data is simply structured, within list items for example...

Expert Comment

ID: 19569794
That one does use list items.

Author Comment

ID: 19572214
trinzi, apologies, you are totally correct.... i was looking at the wrong menu (they really have a lot of menus there!)...

that looks just what i need... now to try it out to see if it does fit my needs....

thanks both for your help


Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Suggested Courses

873 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question