How to decrease the height of header and footer in Sydney theme?

  1. I am unable to decrease the height of the header and footer in my website.
  2. When I load my website in mobile, same issue header height is more and occupies a quarter of the top portion of the site.

A solution would be of great help.


Hello Venkat,

Please share a link to your site here. So I could suggest you with possible code solution depending on current situation on your site.


this is template for your reference

Please load the page from mobile and observe the black space on the top just above menu.
I managed to decrease the height of the menu area by decreasing the font size to 1px for the Site Title. But it was not occuring in mobile view. Please help

Hello there,

Empty spaces at the top is a result of hidden site title and description made with negative text indentation. To avoid it, you’d need to add this extra CSS code:

@media only screen and (max-width: 767px) {
  .site-header .col-md-4 * {
    display: none;
  .btn-menu {
    margin-top: 0;


Awesome. It worked, Thanks a lot.

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.


1 Like