Move header image above menu bar

  • Author
  • #1241418

    I want my header image above the menu… Dont know how else to say it :|
    I have the custom CSS upgrade and am ok at CSS but I cant figure this out…

    The blog I need help with is



    This site linked to your username is not a free hosted blog and you cannot get support for it here. and blogs are separate and have separate logins. We provide support here only for free hosted WordPress.COM blogs and no others. You are posting to the wrong support forums. If you don’t have a username account at click and register one on the top right hand corner of the page that opens, so you can post to the support forums there and receive advice from bloggers.



    This site is a free hosted blog and I suggest you link you username to it. Dashboard -> Users -> Personal Settings -> then scroll down to Account Details. Then scroll down to where it says ‘Primary Blog‘ select the URL for your primary blog and then save changes.


    Take a look at this and see what you think. Add it AFTER all your existing CSS. In general it is not a good idea to paste the entire stylesheet into the CSS edit window unless you are making, massive changes to virtually everything, otherwise it can create conflicts. It is best to put into the edit window, only the specific selectors, an only the specific declarations you are adding or changing.

    .site-header {
        position: relative;
    .main-navigation {
        position: absolute;
        top: 135px;
        width: 100%;
    .wrapper {
        margin-top: 30px;
    .main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
        border-top: none;

    Ok I did… Can you help me now??


    Thanks thesacredpath.
    I was just trying the copy/paste option to see if I could get it to work. I have erased it all and just added the code you gave me and it worked. Thanks!

    Now can you tell me how to remove the line above the image? :)


    Add this to the custom CSS:

    .site-header img {
    box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.2);

    Magic! Thanks :)


    You are welcome.

The topic ‘Move header image above menu bar’ is closed to new replies.