Enterprise Child Theme: Dropdowns on nav disappearing upon position: fixed

Community Forums Forums Design Tips and Tricks Enterprise Child Theme: Dropdowns on nav disappearing upon position: fixed

This topic is: not resolved

This topic contains 5 replies, has 2 voices, and was last updated by  David Chu 11 months, 3 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #55131

    HollyCandC
    Participant
    Post count: 5

    Hello all!

    I’d like to make my #nav a fixed element along the top of the page, like Mashable.com’s main nav (the blue one, not the white nav sticky upon scroll), but when I position:fix the #nav elements my dropdowns no longer appear. Any clue what I’m missing?

    http://colesandcolomy.com/

    Thanks!

    I’m using:
    Wordpress 3.6
    Genesis 1.9.1
    Enterprise 1.1

    • This topic was modified 11 months, 3 weeks ago by  HollyCandC. Reason: Broken Link
    • This topic was modified 11 months, 3 weeks ago by  HollyCandC. Reason: Broken Link
    http://colesandcolomy.com/
    #55244

    David Chu
    Participant
    Post count: 1330

    Hi Holly,
    First, let me say that your design really looks great! The dashes, the logo, etc., very nice.

    The fixed thing is an interesting idea. I have a quick answer that may get you started. In your CSS for the #nav DIV, you have this in there:

    [css]
    overflow: hidden;
    [/css]

    This will tend to “erase” the dropdowns when “fixed” is applied. The question becomes, why does it work when it’s not fixed? I’m not sure without tearing the code apart and examining it, but it may be a context thing. So you can try taking that line out, and then you’ll be on your way.

    Obviously there will be a few more CSS tweaks in getting the fixed menu in the right spot and all, but it sounds like you’re up to it!

    You could also try playing with this.

    Dave


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

    #55275

    HollyCandC
    Participant
    Post count: 5

    That was it! Haha, I knew it was going to be one little line. That’s one rule that I’m never going to forget again.

    Thanks for the praise and your help, Dave. You get a gold star for being awesome!

    #55284

    David Chu
    Participant
    Post count: 1330

    Holly,
    Thank you for your kind words, glad that helped! I’d like to see your site again with the fixed thingie on it.

    Yeah, Genesis 1.9, at least its Sample theme, has loads of those “overflow: hidden” deals. So many that one can forget they are there, and end up scratching one’s head, as we did. With that many, and some not obviously needed, I think they were shooting for the whole “fix the collapsing margin” thing that CSS people have discussed at length.

    Brian Gardner had an article about making a sticky menu, and it had this really graceful approach, so that as you scrolled down, it would fade in at the top, and then fade out again after going back to the top. But I don’t see it on his site now. Then again, I don’t think the techniques are necessarily Genesis-specific, so a web search on that general topic should yield a bunch of ideas.

    Best, Dave


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

    #55303

    HollyCandC
    Participant
    Post count: 5

    I had heard of that link in my searching last night, but I also saw it was no longer on his page. Hopefully it will be restored, since everyone raved about it.

    The menu is fixed and I am pleased. Thanks again for the help!

    http://colesandcolomy.com/

    #55311

    David Chu
    Participant
    Post count: 1330

    Ooo, snap, that’s looking great!!
    You didn’t hear this from me, but this looks considerably better than most of the other sites I’ve been seeing these days! Bonus – dropdowns look just dandy at small screen size. If I get some extra time, I may play with this sort of menu.

    As for Brian’s article, he admits that he’s addicted to updating his site every 47 minutes or so. So it may have gotten lost in the theme shuffle. As I recall, some new issues came up with the tut working with some Genesis themes, so maybe the article got put aside.

    Talk again sometime!
    Dave


    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

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

You must be logged in to reply to this topic.