Jump to content

Code causing issues with mobile view

Recommended Posts

Hello, 

I had my website designed, but the designer is no longer available. I am having an issue when adding pages. They appear ok on the desktop view, but in mobile view the header is overlapping the start of the content (images below of the issue)

Squarespace help have said: "With that said, I believe I can see what you’re referring to. On your homepage when you click Edit, it appears the top section is in 2 sections, one on the left (tan background) and one on the right (image background). And when you’re clicking Edit Section when hovering over either, it only shows the 'Edit Section' options for the right one with the image.
 
It appears that the reason is because you have entered custom CSS into your site that is controlling this layout. On Squarespace there are no sections that are left and right, sections only stack on top of one another and take up the entire width of the site. The CSS seems to be causing the section to appear that it is broken into 2 sections side by side, making the one on the left non editable"

I have no idea where to start to fix this - would anyone be able to offer any advice please? Thank you SO much. 

Desktop view: 

image.thumb.png.65e698793a84a9298db259513f1a702b.png

image.thumb.png.d2304c64a0545f06d6b5bbb5dedf0715.png

 

Mobile view: 

image.thumb.png.fa32a398ebf0ceb077eef51636d88c44.png

image.thumb.png.601cc164ac268fdd4b79761640fe6fae.png

Edited by aemerson
typo
Link to comment
  • Replies 2
  • Views 1k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

It appears that you have this code in your Custom CSS that is causing the padding in the header to be very large:

.header .header-announcement-bar-wrapper {
    padding-top: 9.5vw;
    padding-bottom: 9.5vw;
}

There also should be a margin added to the top of every first section so the top of the page (and in this case your head in the photo) is not cut off:

image.thumb.png.14c82756ac3899249d70b4b7cdf7fcad.png

I think there's some coding gone awry here.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.