Reduce space between header image and logo on mobile


#1

Hello

I would like to reduce the space in between the header image and the menu or logo on mobile. Desktop is perfect. Thank you


#2

Hello there,

Please try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width: 767px) {
      .fl-node-5afcf872570b0 .fl-node-content {
        margin-top: 0;
      } 
    } 

Regards,
Kharis


#3

Moved it up a little… Thank you… Any way I can move it up a little more and also limit the space under it between the image and the contact form?

Thank you


#4

Hello there,

Please try this code:

@media only screen and (max-width: 767px) {
  .site-header {
    padding-bottom: 0;
  }
  .fl-node-5afcf872570b0 .fl-node-content {
    margin-top: 0;
  } 
  .fl-node-5afcfa1f5fe1a {
    margin-top: -90px;
  }
} 

You might need to edit your header image as it contains excessive space by default on top and bottom. Edit it with an image editing program like Photoshop, and re-upload it.

Regards,
Kharis


#5

Perfect as usual! Thank you again!!


#6

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.

Regards,
Kharis