Support » Fixing WordPress » How to make header and nav menu side by side?

  • Resolved kristen.ncl

    (@kristenncl)


    Hi, I am trying to get my header and nav menu side by side. Any tips? My Page.
    I want it to be formatted like this: example – as in their menu “Log in” – “About Us”.
    Thanks for your help!

Viewing 8 replies - 1 through 8 (of 8 total)
  • Try adding these lines to the end of style.css:

    #branding { height: 80px; }
    #site-title, #site-description {
       margin: 0;
       width: 325px;
       position: relative;
       top: -100px;
    }

    Thank you so much! I still have tweaking to do, but this worked perfectly.
    Do you know how I can change the background of the menu to transparent and place the search bar to the right of the nav menu?

    This requires a number of lines of CSS code, and I am not sure that I got all of them correct, so you may need to make adjustments.

    #branding { height: 50px; }
    #branding hgroup { margin: 0 15px; }
    #branding #searchform { top: 1em; }
    #access {
       float: left;
       width: 50%;
       margin: 0 0 0 270px;
       background; none;
       box-shadow: none;
       -webkit-box-shadow: none;
    }
    #access li a { color: #000000; }

    Excellent, thank you so much!

    Hi, I tried your code and it works very well, thank you!
    However, now I have my nava menu aligned to the center of the header, while I’d like it aligned to the bottom… any suggestions?
    Thank you very much!

    If you mean at the bottom of the content, above the footer, chances are that this cannot be done with CSS alone. And, the code would be different for each theme.

    Please start a new thread for this topic and post a link to your site.

    No, I don’t mean to the bottom of the content, just to the bottom of the logo: the menu is now aligned to the center of the logo, while I’d like it to be aligned to the bottom of the logo (and of course the background should adapt to it).
    The website is not online yet, but you can see a screenshot here.

    deborahbabin

    (@deborahbabin)

    I have a slightly different goal: to add a drop shadow on the header.
    I use YOKO theme. The header is nice a large but flat.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘How to make header and nav menu side by side?’ is closed to new replies.