Support » Themes and Templates » How do I make a submenu horizontal instead of Vertical?

Viewing 7 replies - 1 through 7 (of 7 total)
  • If your menu is loading in lists, have a look at:

    http://accessify.com/tools-and-wizards/developer-tools/list-o-matic/
    or
    http://css.maxdesign.com.au/listamatic/

    You may also want to look for “suckerfish” menus if you want css driven drop down menus if you have parent items with children in a sub-list.

    Hope this helps.

    Thread Starter garysumpter

    (@garysumpter)

    Thanks a lot for the reply, but that seems like overkill, using an external tool.

    Surely it’s just a css issue or something?

    Gary

    if you’d looked at the tool, you would have seen that the external tool in question gives you various snippets of CSS to style your menus.

    In other words, you can customise your list the way you want it.

    So yes, it’s a css issue. And there are so many ways to make horizontal menus out of UL’s with css, it’s not really possible to give them to you here. Hence, the links, play with those, see how they are done.

    Good luck.

    Did you try the tutorial at A listapart

    If you want a tag to follow something horizontally instead of going to a new line, you do it in css with float: left; or float: right;

    as in

    li { float: left; }

    well, manstraw, not necessarily. And there’s more to it. Floating your li means you have to define a width for them, else you run into potential problems. I personally prefer to use display:inline, but that’s also very simplistic. And if you want to start styling things a little bit more fancy, there’s yet more to it than that. It’s easy, just not quite as simple as all that if you want to do it properly 😉

    Yes, I was being a bit simplistic vavroom. I mean to encourage experimentation by the thread starter, not attempt to provide a full code sample that might not jive with his layout, that he would have to change anyway.

    About width. I don’t typically specify width in a horizontal menu. I let the ‘buttons’ each be the width of the words in the link. I’ll typically put a small amount of padding right and left, and the same for margins. And that’s about it.

    I tend to favour floats instead of display inline. But there is no particular reason for that, except I sometimes reverse the order of display with a float right. Mainly just habit.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘How do I make a submenu horizontal instead of Vertical?’ is closed to new replies.