Putting menu in line with header

  • gasparia405 · Member ·

    I am working in the Edin theme and I am trying to get the menu in line with the header. There is an awkward amount of space in between the logo and the menu and it would look nicer if I could somehow set the menu up higher. I am new to both WordPress and CSS and have added some custom code so far but I am stuck on this problem. I don’t know if it is possible without being able to alter the HTML.

    I know the header div is div.header-wrapper and the menu is “.navigation-classic .primary-navigation .menu-primary”

    The blog I need help with is: (visible only to logged in users)

  • otpidusprime · Member ·

    Hi there,
    I checked out the CSS for the logo area and the menu and found that the space between them is due to the large amount of margin added to the logo and the search icon which adds a lot of white-space in the header.

    So what i can suggest to remove/reduce the spacing is edit this codes: 

    /*this css codes add whitespace to the top and bottom of your site logo*/
@media screen and (min-width: 600px) {
    .site-logo-link, .site-title {
        display: block;
        margin-top: 30px;   //edit this value to be smaller than 30px;
        margin-bottom: 30px;   //edit this value to be smaller than 30px;
        min-height: 60px;
    }
}

.site-logo-link, .site-title {
    margin-top: 24px;   //edit this value to be smaller than 24px;
    margin-bottom: 24px;   //edit this value to be smaller than 24px;
}

/*this css code adds whitespace to the top and bottom of the search icon*/
@media screen and (min-width: 600px) {
    .header-navigation, .header-search {
        position: inherit;
        top: auto;
        right: auto;
        float: right;
        margin: 30px 0;   //edit this value to be smaller than 30px;
    }
}

    Let me know if this helps :)

  • onlyfortheheartstrong · Member ·

    Hi I have a similar query about the title and tag line appearing separated and disjointed
    I want the tag line under the title..

    Also, re featured posts: how do I choose which three appear and the order they appear on the front page?
    please can you help
    Thanks, onlyfortheheartstrong – which I want to change to olvindablog

  • otpidusprime · Member ·

    Hello @onlyfortheheartstrong,
    Apologies for the delayed response.
    Please start a new thread with your question: https://en.forums.wordpress.com/forum/css-customization#postform

    This will keep the forum properly managed and your chances of getting answered will also increase.

    Thanks! :)

  • The topic ‘Putting menu in line with header’ is closed to new replies.