Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by elkeschiffer
elkeschiffer
2,296 Points

create main and submenu bars - one below the other - with nested ul - without position absolute

I don't know how to do this without position absolute (the sub-ul must stay nested). http://codepen.io/elkeschiffer/pen/WrjEwe

May someone can help me?

Jake Lundberg
Jake Lundberg
13,965 Points

Not sure you would be able to get the desired outcome you are looking for without using absolute positioning. This is because absolute positioning removs the element from the "normal flow" of the document, which is how an absolutely positioned element is able to "drop down" over other elements...without this (or a way of figuring out how to use fixed positioning) the dropdown menu is going to remain in the normal flow of the document, and when it becomes visible, it will affect the other elements around it.

Can I ask why you do not want to use absolute positioning?

2 Answers

elkeschiffer
elkeschiffer
2,296 Points
elkeschiffer
elkeschiffer
2,296 Points

Thanks Jake!

I want the following content to follow the menu without a gap - regardless of how many navigation levels there will be.

An easy solution would be to seperate the main nav ul and the sub nav ul but I want to enable using keyboard for navigating and without nested uls it would be not in the "correct" order.

Maybe an other idea for solving my problem?

Jake Lundberg
Jake Lundberg
13,965 Points

My apologies, but I don't think I understand what you mean by "following content to follow the menu without a gap" ...do you have an image or wireframe of an example of what you want to do?

elkeschiffer
elkeschiffer
2,296 Points
elkeschiffer
elkeschiffer
2,296 Points

Okay, I put a little bit content into the example. I think you will understand what I mean now.

Solution with position absolute: http://codepen.io/elkeschiffer/pen/WrjEwe The navigation is absolute - not in the normal flow from the document. I have to give the content space above to be seen.

here you can see how I want it to work (but with nested ul): http://codepen.io/elkeschiffer/pen/VeWPbK The content adapt oneself to the navigation - regardless of how many menu-levels there may be.