Hello everybody, I have a problem.
Let's say, I have a menu in the header of our web page. Now, the menu have some sub-menus... So, that looks then something like:

Home | About | Menu3 | ......

Incl. our sub menus:

Home | About | Menu3 | ......
HoSub1 - HoSub2 - HoSub3 - ...

Ok, that work's well when you open the first menu (Home, in our case), but when I open now the "About" menu, it looks like:

Home | About | Menu3 | .....
ˇˇˇˇˇˇˇˇˇAbSub1 - AbSub2 - AbSub3 - .... (without the "ˇ")

Means, I have many space on the left side. What I want is, that every sub-menu row, should start right under the first menu (home).

I've already tried positioning, absolute - I could, but it would only work on my resolution (the menu starts centered in a middle wrapper div) - so far as i know, relative - of course not every link starts at the same position,...

I hope you get, what my problem is.

Greetz

I think most people here will understand your problem, but there is very little anyone can do about it with just this information (apart from just guessing). You'd be better of posting a link to where this can be seen.

Here's my "new" try..
Old one's:

margin-top: 20px;
position: absolute;
left: 150px;
width: 952px;
background: #7A8FBD;
padding: 5px 5px 0 5px;

With that (old) styles it does works, but only for only 1 menu link

And yeah, the menu items are only for testing...that why it's not direct in lines.

EDIT:
I forgot to say. Width should be 100% of the inner container (960px)

Is this online somewhere and if so could you link to it? It's much easier to solve if we can see a live example. If not could you post the complete code you're using, both html and css.

Based on what you posted so far it looks like the value you've set for left: doesn't work under each top level link, but it's hard to know why without seeing all the code.

Nah, runing on localhost currently. It's a joomla template.

Here's just the menu part:

<div id="top-menu">
  <ul class="menu">
    <li class="item-101 current active deeper parent">
      <a href="/hm/">Predstavitev</a>

      <ul>
        <li class="item-104"><a href=
        "/hm/index.php/predstavitev/sadsa">sadsa</a></li>

        <li class="item-105"><a href=
        "/hm/index.php?Itemid=105">kjlhkljhklhkjlhkl</a></li>
      </ul>
    </li>

    <li class="item-106 parent"><a href=
    "/hma/index.php/jhjhklh">,jhj,hklh</a></li>
  </ul>
</div>

and the css:

#top-menu {
  font-size: 13px;
  font-weight: bold;
  float: left;
  width: 960px;
  height: 26px;
}

#top-menu ul {
  float: left;
  padding-top: 5px;
}

#top-menu ul li {
  float: left;
}

#top-menu a {
  color: white;
  text-decoration: none;
  margin: 0 20px;
  float: left;
}

#top-menu a:hover {
  color: #234076;
}

#top-menu .active a {
  color: #234076;
}

#top-menu ul .parent ul {
  margin-top: 20px;
  position: absolute;
  background: #7A8FBD;
  padding: 5px 5px 0 5px;
  float: left;
}

#top-menu ul .parent ul li {
  background: #95A5CA;
  margin: 0 2px;
  padding: 2px 0;
  float: left;
}

#top-menu ul .parent ul li:hover {
  background: #BFCBE4;
}

#top-menu ul .parent ul li a {
  color: #FFFFFF;
}

#top-menu ul .parent ul .active {
  color: white;
  background: #eef3f9;
}

#top-menu ul .parent ul .active:hover {
  background: #eef3f9; 
}

#top-menu ul .parent ul .active a {
  color: #234076;
}

Is this all the code? I don't see how your menu is working based on the css above. Typically a submenu like this will appear and disappear based on the hover state of either the top level list item or link, but I don't see any css doing that.

I would expect to see a css selector ending in :hover ul, but don't see any.

Hard to tell what's wrong from what you've posted.

No, it's not a dropdown menu. It's a standard joomla menu. The point is... You click a link in the "top-level" menu, it redirect's you to a new page.. IF the redirected link/page have some sub-menus, they apear ONLY on this current page. There is no menus/sub-menus/sub-sub-menus/... on the same page.... the only sub-menu that shows up, is that one, that you're current on.

Yeah, it's a bit weird, but i hope you understand :/

Now I wanna make, that the (current) sub-menu is 100% throught the page (960px - the inner content container/wrapper)

Oh. It sounds different than what I was thinking. I was expecting the submenu appears on hover.

I'm still not seeing anything in the code I would think would be causing a problem. My thought was it was spacing you're adding to the left, but I only see that with a padding on .parent ul. Maybe it's something that needs to be adjusted a little per top level menu item. It's not necessarily an elegant solution, but perhaps adding classes to the top level list items and then modifying the position in your css for each one that needs an adjustment.