Jump to content

How can I get the height of the header to adapt when resized?

Recommended Posts

Site URL: https://www.rubysplace.org/

Hi all, I noticed that in mobile view (or when the browser width gets small enough to show the menu icon) , the height of the header still remains the same as when it shows all the links stacked. This results in the appearance of a lot of white space above the hero image. 

How can I get the header height to wrap around the icon when it is downsized? 

I really appreciate any help on this!

Screen Shot 2020-03-11 at 3.50.48 PM.png

Link to comment
  • Replies 2
  • Created
  • Last Reply

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
.Main-content {
    padding-top: 0;
div#block-yui_3_17_2_1_1583906902259_41269 {
    padding-top: 0 !important;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.