Creating floating nav bar for eleven40 theme

Community Forums Forums Design Tips and Tricks Creating floating nav bar for eleven40 theme

This topic is: not resolved

This topic contains 6 replies, has 2 voices, and was last updated by  afinevo 6 months, 2 weeks ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #104590

    afinevo
    Participant
    Post count: 69

    Hello everyone. I am currently using the eleven40 non pro theme with the main navigation bar that goes up off the screen when scrolling down. Is there a way to make it a floating nav bar that stays at the top for viewers to see like the eleven40 Pro theme?

    Thanks in advance!

    http://allgaragefloors.com
    #104593

    Sridhar Katakam
    Participant
    Post count: 1068

    Add this CSS:

    #wrap {
        background: none;
    }
    
    #header {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        z-index: 999;
        background: url(images/bg.png) repeat-x;
    }
    
    #inner {
        margin-top: 90px;
    }

    #104698

    afinevo
    Participant
    Post count: 69

    Thanks Sridhar, but I can’t just add this without removing part of the CSS that controls how the main nav bar works now can I?

    #104700

    Sridhar Katakam
    Participant
    Post count: 1068

    You can. Just add the above code at the end in style.css.


    #104701

    afinevo
    Participant
    Post count: 69

    Thanks for the fast response Sridhar. That does seem to be working, but there are a couple of issues. The first is that the admin bar now interferes with the menu by blocking half the nav bar. The second issue is that the font at the very top is slightly cut off. Suggestions?

    Thanks again!

    #104725

    afinevo
    Participant
    Post count: 69

    I have now encountered a third issue that caused me to delete this particular CSS for now. The main nav bar does not work correctly in a responsive format. The main nav bar drops down a bit and blocks out a top portion of the page. It’s not a very professional look and can be confusing.

    Anyone have suggestions?

    #105129

    afinevo
    Participant
    Post count: 69

    I’m just bumping this back up. Can anyone help on this?

    Thanks!

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

You must be logged in to reply to this topic.