Support » Theme: Tonal » Space between Header image and Body of One Page

  • Resolved tjramos85


    So I have this space of white, a thing gray bar, and another space of white between my header and the copy of my site.

    I know I should be using a child theme, but I haven’t done that because I’m relatively new to wordpress, but I know some html and CSS.

    The site is,

    How can I, if possible, fix this.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Hello,

    I’m guessing you want to remove, or at least control, the amount of space between the header and the content? Fortunately this is pretty easy. It looks like your header#masthead HTML element has 120px of padding at the top and bottom. You can change this by simply specifying another amount of padding in your CSS:

    header#masthead { padding-bottom: 20px; }

    Regarding the grey bar, it’s again the header#masthead element that’s displaying it, this time as a border-bottom property. To elminate it, simply tell it not to use a bottom border in the CSS:

    header#masthead { border-bottom: none; }

    To further reduce the whitespace, the header.entry-header element also has some padding at the top which you could reduce or eliminate.

    Anyway, it’s good practice to start using child themes right off the bat as it’s not only the right way of doing things, but you don’t run the risk of irrevocably messing up the parent theme in the process of tinkering. There a pretty fantastic plugin that simplifies child theme creation that you may way to look into.

    Cheers. I hope this is helpful.

    Thank you so much!
    Worked like a charm!

    You’re certainly welcome. If you don’t mind, would you take a moment to mark this topic as “resolved”? Thanks a bunch.


Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Space between Header image and Body of One Page’ is closed to new replies.