Gemini question – Menu v. Nav

  • Please excuse me if the answer to this should be obvious, but I’m just learning CSS, and I don’t get what the function of the “nav” division is in relation to the “menu” division. Is nav supposed to replace menu? Fit inside it? Reading the index is no help, because it lists both, one after the other. The updated CSS for Gemini has a “main” section for both menu and nav (as well has hmenu and hnav, which I don’t have a clue about). But the “details” section no longer lists any menu details. (I.e., #menu form, #menu input#s, #menu ul, etc.)
    I copied all the menu stuff from the old CSS and put it in the new CSS, just to see what it did – I got a double ‘container” but only one set of “info” in the menu area. I commented out the “nav” stuff and only got one instance of the menu container and the menu information. Then I commented out all the “menu” stuff, and got the same thing.
    So, what’s the point of having both in the main CSS “body and page layout” section?
    Color me clueless!

Viewing 4 replies - 1 through 4 (of 4 total)

  • I haven’t looked at the gemini layout, but one way for you to go about testing things is to go into the index and just put some text that’ll show up in each division so you can see where they’ll show up.

    Yes you are quite right. In Gemini the #menu is floated right and has a fixed width. Consequently we can not add padding or borders to it or without hacking it will bork in some browsers. So to facilitate menu styling a second div nav is nested inside it. That is where to start styling fancy borders, rollovers, and stuff. #hmenu and #hnav are empty but they fulfil a sinilar function for designers and end users if they need them. They are just place holders. HTH.

    Thread Starter karenjg

    (@karenjg)

    Well, the problem is, the text shows up with just “li” or “ul” or whatever – In the style sheet, those terms are preceded with a “#menu” or a “#nav”, as in the following partial copy of the CSS section:
    #menu form {
    margin: 0 0 0 15px;
    }
    #menu input#s {
    width: 80%;
    background: #eee;
    border: 1px solid #999;
    color: #000;
    }
    #menu ul {
    color: #004000;
    font-weight: bold;
    list-style-type: none;
    margin: 0;
    padding-left: 3px;
    text-transform: lowercase;
    }
    and
    #nav form {
    margin: 0 0 0 13px;
    }
    #nav input#s {
    width: 80%;
    background: #eee;
    border: 1px solid #999;
    color: #000;
    }
    #nav ul {
    color: #004000;
    font-weight: bold;
    list-style-type: none;
    margin: 0;
    padding-left: 3px;
    text-transform: lowercase;
    }
    For the purposes of the index rendering the text via the stylesheet, it doesn’t seem to matter which “form” or “input#s” or “ul” is used – nav or menu, it comes out the same.

    Thread Starter karenjg

    (@karenjg)

    Ack. shoulda checked for new responses before posting the above. I get it now. The menu is the “container” for positioning, and the nav is the design vehicle, right?
    Thanks, root!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Gemini question – Menu v. Nav’ is closed to new replies.