Header Size


Is there a way to control the size of the header. I would like to make it a bit smaller.


Thank you.


Did you mean that you want to reduce the height of logo image? if so, you can use this css code below:

img.site-logo {
    max-height: 80px;


I have played around with the logo size before and I am happy with that. it would be the size of the header(grey part) under the logo when you first land on my page.
Can I somehow push from image slider down? (I feel that the header with it being grey takes away from the size and feel of the image slider)
However with the header transparent (as original) menu and logo get lost.

any suggestions would awesome!

Hi Awan,

any update or suggestion on this on?

Thank you!

Hi, sorry for delay.

The size of header section (grey part) are automatically adjusted by the logo image size. So please don’t blame the header section size :stuck_out_tongue:

Maybe you want the header and logo look like this http://prntscr.com/8hkv1o? if so, you can try this css code below:

@media only screen(min-width: 1024px){
  header#masthead .row > div:first-child {
    position: absolute;

  header#masthead .row > div:last-child {
    float: right;

Hi Awan,

Thanks for the info and suggestion!