I have a site I am working on utilizing some drop down menus. The site is based on Wordpress but that doesn't seem to be the issue...
The site is: www.bamboodancer.com/bamboo
The "pages" of the site have been arranged on the right as a normal menu. The menu is supposed to have three levels-
Main
--Subpages
----SubSubpages
The positioning of the first two works nicely, with the drop down showing up to the left of the link.
The positioning of the third level ends up showing up where the second level menu does. For an example of this, look at the last link on the nav menu - "Links". I added several drop down levels there. On the second, you'll see that the next level shows up at the top. Obviously, this shouldn't happen.
How do i get it to show up next to (to the left of) the current item selected?
The stylesheet for the menu is here:
bamboodancer.com/bamboo/wp..._style.css
Any suggetions? My head is bloody from banging against the wall...
The site is: www.bamboodancer.com/bamboo
The "pages" of the site have been arranged on the right as a normal menu. The menu is supposed to have three levels-
Main
--Subpages
----SubSubpages
The positioning of the first two works nicely, with the drop down showing up to the left of the link.
The positioning of the third level ends up showing up where the second level menu does. For an example of this, look at the last link on the nav menu - "Links". I added several drop down levels there. On the second, you'll see that the next level shows up at the top. Obviously, this shouldn't happen.
How do i get it to show up next to (to the left of) the current item selected?
The stylesheet for the menu is here:
bamboodancer.com/bamboo/wp..._style.css
Any suggetions? My head is bloody from banging against the wall...
posted by:
|
San Diego
|
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Wed, July 9, 2008 - 4:31 PMmichael,
that's a really good question
I took a look, poked around for a few, the answer did not immediately jump out at me.
but I wanted to let you know that you are not alone banging your head against this stuff.
I'm also working on a ul li ul li structure and having trouble getting the final tier to follow basic instructions like size and placement.
best of luck to you, let us know what the key turns out to be!
nicely elegant coding btw -
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Wed, July 9, 2008 - 4:47 PMactually i think i just found my problem and it's probably unrelated to yours but just in case:
i'm basically building a table using list items. you click on the top row to show the details, if you have js; and if you don't, it's all expanded already when the page loads. anyhow I was using something like
#outerbox li ul li{
/*whatever*/
}
to structure my top row, then trying to say
.bottomrow li{
/*whatever*/
}
to do the bottom row and for whatever reason that second command just would not overwrite the first. but when I changed the top one to be
.toprow ul li{
/*whatever*/
}
instead of calling the outer box -- suddenly it all works and I am relieved.
probably not the same thing that's causing you problems. good luck!
-
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Thu, July 10, 2008 - 2:16 AMI haven't looked at your stylesheet but..
shouldn't you just give the third level ul a class like ulLevel3 and absolutely position it to wherever.
That should work -
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Thu, July 10, 2008 - 11:51 AMwell, you know, i thought so too... thought that it would just follow in line with the other lists... but it doesn't seem to play like that.
In this construction:
<ul>
<li>
<li>
<li>
<ul>
<li>
<li>
<li>
<ul>
<li>
<li>
<li>
</ul>
</li>
<ul>
</li>
</ul>
I think I got that right, but regardless if that markup is off a bit... the third level list show up overlapping the second. The second is positioned to show up to the left of the menu item and then, of course, the next one should show up in the same fashion. Instead the third list overlaps the second list, showing up as if it were the second list... it makes no sense! -
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Thu, July 10, 2008 - 2:09 PMok so it should be: (ignoring the underlines which are just to make it easier to see)
<ul id='first level'>
__<li>
____<ul id='second level'>
______<li>
________<ul id='third level'>
__________<li>
__________</li>
________</ul>
______</li>
____</ul>
__</li>
</ul>
so each additional level should be nested in the preceding level.
Level 3 nested inside Level2, which is nested inside Level 1
you should then be able to put a style on the UL to be positioned for example:
ul {
position:absolute;
left:150px;
}
assume you already know where to add the hover stuff yourself.
-
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Mon, July 14, 2008 - 12:34 PModdly enough... i leave it for a few days, come back to it, add "position:relative" and it works... i had all the ul/li tags correct, (although my previous post might have written them wrong) but adding this:
left:-164px;
position:relative;
display:block;
instead of position:absolute put them in the right place. Now, i want to say that i'm certain that i tried that combination already... really... -
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Tue, July 15, 2008 - 12:56 AM;p
-
-
-
-
-
Re: 3rd Level Vertical Drop-Down Menu Positioning
Fri, July 11, 2008 - 4:16 PMas a side note: you should give the nav copy some padding on the left. looks funny w/ the text bumped up against the edge.
