How to reduce the padding of header on homepage

  • Hello,

    I would like to reduce the homepage’s header to get the same height as header on archives.
    I have found that changing the value of em in .site-branding {padding: 4.25em 0;} modifies the height of header in categories /archives but I have not found how to modify the height of header on homepage and following pages. I don’t use any image for the header, just the gray background-color.

    Sorry for my English.

    Thank you for your theme and for your attention.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator Kathryn Presner

    (@zoonini)

    Hi niyati – it’s always much easier to help if we have a link to your site, is it possible to provide one so we can take a look at things directly? Thanks!

    Thread Starter niyati

    (@niyati)

    Hello,

    Thank you a lot for your attention. I apologize to be this late, I was sick and then I forgot to check on Internet.

    I made a screencap of the DEMO theme to show what I mean with the difference of height of the custom header on the homepage / following pages and the custom header on the posts / categories (Image – my site is at the root but not online yet) I wanted to know if it is possible to have the height the same everywhere (like in posts/categories) or if this height can’t be customized.

    Sorry for my English.

    Have a nice week.

    Moderator Kathryn Presner

    (@zoonini)

    You could give something like this a try in your custom CSS or child theme, adjusting 5em as you like.

    .home .site-branding {
  padding: 5em 0;
}

    Don’t edit the theme files directly, otherwise your changes will be overwritten every time the theme is updated to the latest version.

    An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS.

    As alternatives, you could either install a standalone custom CSS plugin, or create a child theme.

    Thread Starter niyati

    (@niyati)

    Thank you for your answer! I’ve already tried to change that line in the CSS but nothing happened on the homepage even when I wrote 0 as value for the padding.
    I will create a child theme and try to custom CSS with the Jetpack, maybe it will finally have effect.
    Have a nice day

    Moderator Kathryn Presner

    (@zoonini)

    Hi niyati – how did the custom CSS work out?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to reduce the padding of header on homepage’ is closed to new replies.