How to remove white space above header and below footer?

  • Resolved RVDA55

    (@rvda55)


    11 years, 2 months ago

    Hi,

    I’ve been scouring the internet for hours now but no one seems to be able to answer the question..;

    How do I remove the standard white space above the header and below the footer of my Twenty Twelve theme?

    I noticed the gaps are 48px high. But searching the style.css for ’48’ and changing it to 0 does nothing at all. What is going on and how do I change it? Also I would expect there to be something like ‘margin-top 48px’ but nothing to be seen anywhere… do I need to edit another file to make this work?

    I just want to remove this ridiculous amount of whitespace (how did that help ANYONE), thanks in advance.

Viewing 15 replies - 1 through 15 (of 27 total)
1 2
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    Did you come across suggestions like, “Use firebug”?
    Or comments that say, “Do you have a Custom CSS plugin or a Child Theme”?

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    Yes, I have Firebug and couldn’t find anything. I hardly know how to operate it anyway.

    I don’t have a custom CSS plugin or child theme.

    So if anyone can just tell me what I need to do to get it to work thanks in advance.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    Download (and install) a Custom CSS Manager plugin.

    Then add this in the section of the dashboard allocated by that plugin;

    .site-header {
 padding-top: 0;
}

footer[role="contentinfo"] {
 padding-bottom: 0;
}

    If that still didn’t resolve the issue, you’ll need to link your website.

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    Hi Andrew,

    what do you mean by ‘allocated by that plugin’? Do I need to go to the dashboard and then what?

    I know only a tiny bit of css.

    Thanks

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    Have you installed the Custom CSS Manager plugin?

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    Yes, and it’s active. If I need to paste that code into the custom css box (under that plugin’s settings) I have done so. I refreshed my site but nothing changes.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    You’ll need to link your website.

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    I deactivated the header and navigation because I want to make a squeeze page out of it.

    Link

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    The header’s styles are still present.

    Instead of this code;

    .site-header {
 padding-top: 0;
}

footer[role="contentinfo"] {
 padding-bottom: 0;
}

    Try this;

    .site-header {
 display: none;
} 

footer[role="contentinfo"] {
 padding-bottom: 0;
}

    Any styles you make to the theme’s files will erase when the theme updates

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    Thanks for the help, but the margins around the body are unchanged and still there.. any other suggestions?

    I tried clearing the temporary files etc. but doesn’t do anything regarding the white space.

    The second code you provided did remove the header btw.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    Try adding this;

    #page {
 padding: 0;
}

#primary {
 margin: 0;
}

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    That seems to remove the horizontal margins between the body border and the content..

    I’m surprised how hard this is to fix. I just want the body to touch the borders of my browser.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    The difficulty is communicating correctly between us.
    Add the code prior to this post. Don’t replace previous code, append to it.

    Thread Starter RVDA55

    (@rvda55)

    11 years, 2 months ago

    Thanks for your help, but that second code doesn’t do what I want. Or is there more coming?

    I put both codes in.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 2 months ago

    What are you referring to as the body?

Viewing 15 replies - 1 through 15 (of 27 total)
1 2
  • The topic ‘How to remove white space above header and below footer?’ is closed to new replies.