Move position of main nav bar to below header image

  • Author
    Posts
  • #1217956

    katieyoungs
    Member

    Is it possible to move the main nav bar to a position below the header image in twentytwelve. I have custome design.

    Would something like this do it?

    .main-navigation {
    position: absolute;
    top: XXXpx:
    }

    where XXX is the position? If so what position should I use?

    Thanks

    The blog I need help with is katieyoungs.wordpress.com.

    #1218094

    Give this a try and see what you think.

    .main-navigation {
    bottom: 0;
    position: absolute;
    }
    
    site-header {
    padding-bottom: 70px;
    position: relative;
    }
    #1218144

    katieyoungs
    Member

    Hi there

    Thanksfor this, but unfortunately it moves the main nav bar to below the contact of the whole page, not to just below the header….

    #1218157

    Sorry, I had an oops and somehow missed the opening . on site-header. Use this:

    .main-navigation {
    bottom: 0;
    position: absolute;
    }
    
    .site-header {
    padding-bottom: 70px;
    position: relative;
    }
    #1218180

    I have a similar qu. i want to do roughly the same on theme Yoko – move the navbar below the header image. i’ve tried the code you’ve put above here for katie, but it’s not working on yoko. Can you help pls?

    #1218181

    Please start a new thread since you are using a different theme. That keeps down the confusion later on when someone lands on this thread. Thanks in advance. I’ll keep a lookout for your new thread.

    #1218182

    will do.

    #1218186

    lmhutton1
    Member

    I have tried the above code into the CSS editor, and there is no change made, ideas? I am using twentytwelve too.

    #1218187

    Works just fine for me on my test site. Give it another try.

The topic ‘Move position of main nav bar to below header image’ is closed to new replies.