how to "horizontalize" a dropdown menu

Basically you have a list using html tag “li” and then in CSS for that section (control through div, li, id or whatever) you set the list to:
display:inline
that causes the listto display horizontal or “inline”

[I’m a little bit stupid]
I can’t see your drop-down menu lol !
where is it?

@webjunk:

I don’t get it. I’ve set the list to display horizontal, but it doesn’t do it? Or does “inline” mean “vertical”?

EDIT: Oh, now I got it. There’s the css-command “inline” missing, right?
I’ve tried to put it somewhere now, but I can’t figure out, where I have to add the “li”…

@forunner:

Maybe it’s a browser problem, but you should see it on top (beneath this picture frame hanging down from the top).

display : horizontal is not a valid css properties
display can take some options :
the most usefull are
-block(default for your li)
-inline

block means …it’s a block…each time you put a block, you go to the next line
inline tags are always inside a block. you can put multiple inline things on the same line ^^

(you can use “block-inline” for recent navigators)

display : horizontal is not a valid css properties

Your completely right. It was missleading when I wrote “I’ve set the li to display horizontal”.

Now, I tried to add (or change the former “block”) properties “display: inline;” almost everywhere I could imagine. But nothing changed.

When I add it to the general property:

ul, li {
list-style: none;
list-style-type: none;
display: inline;
}

it ruins my layout and still doesn’t change the menu’s appearance.
Can you figure out, which div id or class I have to target?

You need to add to your theme’s syle.css (if I have the right section):

#topnavi li {display: inline; }

hm… that’s strange. My former menu had the div class “top_nav”, but when I copied the code from the TwentyTen theme, I commented the whole “top_nav” properties out, so you shouldn’t have even seen them.

Was that just a guess or do you really see a div-container named “top_nav”?

(Anyway, I’ve tried it and it still doesn’t work…)

To give it a trial, I commmented the whole “access” properties (from the TwentyTen theme) out and set the (former out commented) “top_nav” properties back in and added the display:inline command to it, but that didn’t arrange it horizontally neither.

I also tried to rename all “access” properties in “top_nav” but also without any gain…

Something else seems to prevent the “inline” property from working properly.

Any idea?

Update:

Now I got the menu itself ordered horizontally. But the submenus still appear on the left hand side…

Is this a “simple” display:inline-problem, too? Or is there a little more to do?

Probably same.

@webjunk:

I tried the inline property, but it only changes the (horizontal/vertical) arrangement of the submenu, but the submenu itself stays on the left of the main menu.

But I want the submenu to drop down from each main menu link to whom it belongs. This doesn’t seem to be resolvable by adding the display:inline property somewhere.

Is there any “float:???” or “position:???” property that needs to be added or fixed?

Try changing the sub ‘li’ or ‘ul’ position style from ‘absolute’ to ‘relative’…I had the same issue and it seemed to fix mine. However, I am writing this comment on the fly and did not look at your source code.

…SO…I would play around with the “position:” styles and change the one that says “absolute” to “relative”…that should fix it…

Try changing the sub ‘li’ or ‘ul’ position style from ‘absolute’ to ‘relative’…I had the same issue and it seemed to fix mine. However, I am writing this comment on the fly and did not look at your source code.

…SO…I would play around with the “position:” styles and change the one that says “absolute” to “relative”…that should fix it…

How did you solve the problem? It looks like your menu is working now on your site.

I have a similar problem. I built my own theme and wanted to use the Twentyten menu. Have formatted everything set to my liking, except the menu appears vertically instead of horizontally.

Have tried replacing all the display: block with inline and changing or removing the absolute and relative positioning but to no avail.

I’m working on MAMP so my site/menu is not active online yet.

Would be great if you could post your solution.
Thanks!