For CSS dropdown menus, I usually stick with the Son of Suckerfish dropdowns. The technique works extremely well, but there’s one small thing that’s always bothered me: the width of the dropdown links is always fixed.
Are there any ways to automatically resize the width of the items in a Suckerfish dropdown menu? If not, are there any other CSS-based dropdown menu strategies that can accomplish this?
Because the
lielements arefloated inside theulelement, they need to have a set width that is equal to theulelement. Otherwise, they will all be on the same line. The fixed width forces each one to jump to the next line.Example: http://jsfiddle.net/ZhguL/3/
If you want, you can use jQuery or just plain JavaScript to calculate the width of the longest menu item in each
uland set eachliand theul‘s widths to this this value.