CodingForums.com - Positioning inner UL to outer UL

CodingForums.com (http://www.codingforums.com/index.php)

- HTML & CSS (http://www.codingforums.com/forumdisplay.php?f=13)

- - Positioning inner UL to outer UL (http://www.codingforums.com/showthread.php?t=247387)

Positioning inner UL to outer UL

Hey all,

I'm having a problem building a menu using ul elements. The menu looks something like this:

Code:

    <ul class="level0">

        <li id="nav-1-1" class="level1"><span> Option1 </span>

        <ul id="submenu" class="">

                <li class="level2" first="" nav-2-2="">

                <li class="level2" first="" nav-2-2="">

                <li class="level2" first="" nav-2-2="">

        </ul>

        </li>

        <li id="nav-1-1" class="level1"><span> Option2 </span>

        <ul id="submenu" class="">

                <li class="level2" first="" nav-2-2="">

                <li class="level2" first="" nav-2-2="">

                <li class="level2" first="" nav-2-2="">

        </ul>

        </li>

</ul>

I would like to position all of the inner ul elements (two in this case) to a specific place relative to outer ul element (for example top right corner of the outer ul) and not the li that contains them. Is this possible at all, without using the position: fixed ?Any help is greatly appreciated!

You have an error in your source code.

Your LI tag inside the UL are not closed.

The solution to your problem:

try:

Code:

<li style = "position: absolute; top:0; left:0; width:200px; height: 20px;"></li>

(please close your LI tags!)

width and height are whatever you want them to be

Of course, you can make the CSS external, but you get the idea ;)

Important:

In order for this to work, make sure the UL container has "relative" positioning:

Code:

<ul style = "position:relative">

good luck

Yes, the code I posted is just an example, more of a pseudo-code, the real code is a bit more complex and quite long to put in here. Sorry 'bout that.

Anyway, this is the site that you can see how it looks at the moment:
http://colijn.staging.levi9.com/meubelplaza/
If you'd select filter a drop-down menu will appear, and then you can hover over different options in that menu. Each option has a sub-menu that opens to the right, but at a different top position. What i would like is that all of these sub-menus open at the same position.