Collapse space between header and articles / categories

Hi. How do I collapse the space between the header (logo + site name etc) and the article or category list on the article/category pages? It’s really big - the empty space - at the mo? Thanks.

Hi,

Here is the code decrease the space that you mentioned above. you can add the code to Customize > additional CSS.

.site-branding {
    padding: 20px 0 !important;
}
body:not(.home) .site-header {
    margin-bottom: 20px;
}

Regards,

Thanks! And then below the category title (‘CATEGORY: etc’) and the grid indexing posts? (On category pages.)

Here you go:

header.archive-header {
    margin-bottom: 30px;
}

.list-style-post {
    margin-bottom: 10px;
}

.sidebar-area .widget {
    margin-bottom: 10px;
}

Feel free to adjust the margin-bottom value.

Perfect! Thank you. And, if I could ask further… the padding within that category header div/box - as attached ‘this bit’ and ‘this bit’

(To reduce the overall height of the white space.)

BTW - is there a css guide for this. I tried reading it all through and I’m by no means an expert on this.

Your expertise is very welcome!

I see… use this:

.archive-header {
    padding: 15px;
}

Thanks! (That worked.)

1 Like