Skip to main content

Forums

This topic contains 4 replies, has 0 voices, and was last updated by  NikeAirforce1s 11 years, 3 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #22582

    NikeAirforce1s
    Participant

    Hi,

    Chris, as you know I’ve been following your psd mock ups to xhtml/css which are great but have you forgotten about the 3 state sprite(hope that’s right) menu? You showed us the hover, off…what about the on? I hope I’ve described it right, when we’re on a page for example "articles", how do we have it so the menu shows we’re on that page.

    Also if you plan on future vid tutorials, can you do one on sliding door menu pls?

    Thanks.

    #47079

    Chris Coyier
    Keymaster

    This reply has been reported for inappropriate content.

    Ah yes, I did forget to touch on the "on" state of the menu. I’ll try and remember to touch on that quickly in part four where I’m going to go back and show how the Photoshop mockup was built, but for now, the theory is that you need to set the background position of the on state to "background-position: top center;".

    My favorite way to do that is by giving the BODY tag a unique ID, like <body id="contact">. Then in the CSS, you can do something like:

    Code:
    body#contact ul#menu li.contact a {
    background-position: top center;
    }

    Because you are being so specific, this will supersede even the rollover state and the menu item will just stay in this "on" state.

    #47080

    NikeAirforce1s
    Participant

    I was hoping that I was not the one that missed it.

    Thanks :)

    #47164

    kindent
    Member

    :cry:

    this code doesnt work, why is that?

    here is the sample

    http://www.paginasprodigy.com/kindent/index.html

    why is making all this rare load, ok…..please help

    ooooooooooo

    i have another question, how can i put some text in the footer, because it is in the wrap y cant put some text, like is in the page……..f*** i need to practice my english……
    :arrow:

    #47184

    wmwood
    Participant

    kindent – Your css is using : where = should be.

    You have:

    Code:

    Which is Invalid

    You should change it to:

    Code:

    as well as change them on the other pages.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star