Jump to content

HELP: Have vertical space issues on mobile, then after I fix it, I have issues with desktop.

Recommended Posts

Hi, I am getting vertical spacing issues on mobile (and tablet) above and below text and individual images inserted into a section as a block.

On tablet I even have an image that is only partially showing and the sticky top header is covering my page title. 

I need to have consistent space above and below each text block and images with a text block image title above each.

The images have a lightbox so you can click on them to see the full size image. I will need to have between 1 and 4 images in a row, each with text titles above them, in multiple parts of my page. Some are in their own sections and some are in long text sections. 

I have tried to reduce the vertical space between all elements on the page as much as possible, so I have the Section Gap set to 0, Background width set to Full Bleed and the least amount of rows possible for each section. 

I really need help. This is a very long Case Study page with a lot of text and many sets of images throughout. 

In addition to the spacing problem for mobile and tablet, each time I set up the page for desktop the way I need it to look, then I check it for mobile, it is wrong in mobile AND now it's all off for desktop.

This is VERY VERY frustrating and I am wondering if I should switch to Squarespace 7.0?

Here's my site and I included a image with all 3 breakpoints and the issues I am seeing.

https://www.melanieklein.tv/ibm-dbg-digital-offering-funnel

pass: obiwanux

 

squarespace_breakpoint_spacing_problems3.png

Edited by Tankgurl
Link to comment
  • Tankgurl changed the title to HELP: Have vertical space issues on mobile, then after I fix it, I have issues with desktop.

Hi thank you for responding!

So I fixed this about 10x yesterday over the course of the day. 

I am now working on a new page using this template and I have to fix the same vertical spacing issues OVER and OVER again 😞

As I go back and forth from desktop to mobile, vertical space is added above and below my images within an image block and a ton of pace below text in text blocks. This also happens for the tablet breakpoints. 

Is there CSS code that can prevent this from happening so I don't spend days just fixing the spacing issues just so they can come back again 😞

Thank you. 

 

Link to comment

Here is the new page I'm working on with the same vertical spacing issues at different breakpoints. 

I have attached screenshots of 1440, 1200, 726, 428. 

For desktop I put red squares around the extra space areas but mobile is actually the worst one. 

I really hope there is some css code that would stop all this extra space from being added at all breakpoints. 

squarespace_breakpoint_spacing_problems4.png

Link to comment
  • 3 weeks later...

I am just SO frustrated and wish I used a different website builder. 

There is NO WAY squarespace does not know about the responsive vertical spacing issues that occur over and over again on EVERY SINGLE PAGE. 

They are obviously choosing to do NOTHING about it since it's been widely complained about since 7.1 launched. 

I even got a response from their Customer Service that they looked into it and could do nothing and told me unofficially about CSS. 

If I knew I would need to be a CSS coder to properly design my site, I would not have chosen Squarespace. 

I just don't understand why they don't fix this. 

This is advertised as a responsive engine and then tell users this extra space that they add is because of a responsive design???? What??

At this point I really feel I want a discount or it should be advertised that you need to know CSS because I would have made other decisions.

Link to comment
  • 1 month later...
On 6/25/2023 at 4:09 PM, Tankgurl said:

Hi thank you for responding!

So I fixed this about 10x yesterday over the course of the day. 

I am now working on a new page using this template and I have to fix the same vertical spacing issues OVER and OVER again 😞

As I go back and forth from desktop to mobile, vertical space is added above and below my images within an image block and a ton of pace below text in text blocks. This also happens for the tablet breakpoints. 

Is there CSS code that can prevent this from happening so I don't spend days just fixing the spacing issues just so they can come back again 😞

Thank you. 

 

How did you fix it?

Link to comment
  • 7 months later...
On 7/14/2023 at 1:41 PM, Tankgurl said:

I am just SO frustrated and wish I used a different website builder. 

There is NO WAY squarespace does not know about the responsive vertical spacing issues that occur over and over again on EVERY SINGLE PAGE. 

They are obviously choosing to do NOTHING about it since it's been widely complained about since 7.1 launched. 

I even got a response from their Customer Service that they looked into it and could do nothing and told me unofficially about CSS. 

If I knew I would need to be a CSS coder to properly design my site, I would not have chosen Squarespace. 

I just don't understand why they don't fix this. 

This is advertised as a responsive engine and then tell users this extra space that they add is because of a responsive design???? What??

At this point I really feel I want a discount or it should be advertised that you need to know CSS because I would have made other decisions.

Having the same exact issue with my website. It's like soooo much extra space for no reason! I looked at your updated site, @Tankgurl and it looks like you were able to fix it? Any suggestions on what we can do?

Link to comment
  • 3 weeks later...

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.