Multi-column menu where all level 3-list elements start at the same place – Tricky?

[tlimited]

Hi.

Is it possible to get all the “ul li ul li ul li” – elements (level 3) to always start on the same place, not relative to the position of the “ul li ul li” (level 2) elements? Something like this: http://dl.dropbox.com/u/56532449/imageforcsshelp_uliuli.jpg

I know that with javascript I could get around this, but that’ll be too hard and I’d like a solution that’ll work without js also.

Please help!

[tlimited]

Nobody?

[Paulie_D]

Got some code to show us…a link would be even better?

[tlimited]

Hi Paulie_D, and thanks for the reply.

The site isn’t fully live yet, so I had to take out the html-source and css and put it in my dropbox. You can see it here: http://dl.dropbox.com/u/56532449/index.html

As you’ll see I’ve started to try to fix this with js. But a CSS-solution would absolutely be the best. Hope you’ll got some ideas!

– t

[Johnnyb]

Can’t you just use absolute positioning on that child ul? If you don’t set the position property of the parent li and set position: relative on the ‘.level2back’ block, then the sub menus will position themselves relative to that.

[tlimited]

Thanks for the tip. I tried to follow it, but I didn’t get it to work :-/
When you say don’t position the parent li, do you mean that I’ll need to give it the inherit: ul li ul li { position: inherit; } ? That does give me the elements clearing up from their standard positioning (what’s good), but they get pushed on top of each other. But how do I then get them positioned under each other?

[Author]

Posts