Support » Fixing WordPress » Space about Nav bar / below header image

  • Resolved zoidmac

    (@zoidmac)


    Ok…beginning to lose will to live – I cannot find the element which is causing the space between the navigation bar and the header image here:
    http://www.homemakeoverservice.co.uk/blog

    I want them to lie flush with each other – i.e menu starts directly below green line of header image.

    Have tried altering the margins and padding on the header image and the menu / nav, but nothing budges it!

    If someone could offer some advice on where else to look that would be great – I think a fresh pair of eyes is all it would take!

Viewing 6 replies - 1 through 6 (of 6 total)
  • WPyogi

    (@wpyogi)

    Forum Moderator

    You don’t have a valid child theme – so fixing that should be your first step – review: http://codex.wordpress.org/Child_Themes

    Then try adding this in a media query:

    .site-header {
        margin-bottom: 0;
    }
    
    .main-navigation {
        margin-top: -2px;
    }

    Thanks! Scary what you miss when staring at something all day…

    With regards to the Child Theme, what do you mean by it not being valid? I’ll tell you what I did – I started this blog editing the original theme files, then saw on most forums people advising working on a child theme, so I copied the original theme files (just style.css and a few folders) – pasted into child theme folder in directory and then selected in wp as the theme to use. It seemed to load without any issues but please let me know where I went wrong!

    Many Thanks

    WPyogi

    (@wpyogi)

    Forum Moderator

    Changing the name on the theme DOES prevent the files from being overwritten when the theme (or WP for default themes) is updated, but it’s not a valid child theme – and you won’t “benefit” from any updates to the theme upon updating. It would be far better to move your changes to the child theme – it’s a bit tedious, but in the long run better to have done it that way. If you moved .php files to the child theme, those are fine and correct… But the CSS file really should only have changes to the parent theme and the required @import line at the top to import the parent theme stylesheet.

    You can use a file comparison program (or some text editors will do it) to find the changes in your current CSS file.

    Ok so if for example there was on the original css:

    .site-header {
    margin-bottom: 10px;
    }

    and I wanted to add ‘padding: 10px;’ would I add:

    .site-header {
    margin-bottom: 10px;
    padding: 10px;
    }

    to the child style sheet and leave the original as is?

    Thanks

    WPyogi

    (@wpyogi)

    Forum Moderator

    Yep, although you would really only need to add:

    .site-header {
    padding: 10px;
    }

    Duplicating the margin should not cause problems, but ideally, don’t duplicate code is the rule of thumb – helps your site load faster and makes it much easier to manage your CSS :).

    Ok – cheers for all your help 🙂

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Space about Nav bar / below header image’ is closed to new replies.