Fluid Engine's GIANT Spacing Problem

[@internetuser12]

thanks for this video i thought i was going crazy and the only one who cared about this issue or realised it even existed. I always use chrome inspector tablet mode to resize viewport and it always look shit on tablet widths. I cant believe that its been this long and still they have not fixed such a critical issue. It shouldnt even be hard to fix. A single competent developer could probably fix this quite quickly!!! I have had to resort to doing weird stuff like adding a code block and making the whole page design using flexbox or other ways like a whole bunch of CSS media queries which is very frustrating and time consuming. I dont udnerstand why they cant just FIX IT AFTER ALL THIS TIME!?!?!!?!

[@SEWebDesign]

I know! Really frustrating!

[@jakemp42]

What a clean, precise, educated explanation of this.

[@SEWebDesign]

Thank you Jeremy! Hopefully they get around to fixing it soon

[@colinboyter]

Thank you. This is so helpful in understanding what the problem is. When FE was first announced SQSP touted the ability to have separate layouts for mobile and I jumped for joy! I assumed it would include a breakpoint for tablet. When FE was finally unveiled I was pretty disappointed to learn that it didn't. In the webinar, they said that they can implement a tablet breakpoint but they are currently choosing not to. I guess they don't want to make it too overwhelming for DIYers. Fair enough, but SQSP needs to address this. It's the reason that I'm still building using the CE and not FE. it would be so helpful to have tablet breakpoints or even the ability to add my own breakpoints too. Thanks again for the work you put into your vids.

[@SEWebDesign]

I REALLY hope they change their mind about the tablet breakpoint! I am glad this video was helpful!

[@user-fi6hg8vq6c]

Wow. What a great breakdown of this issue that should've been addressed before launching. Looking at my portfolio on an ipad is such an eye sore. I hope they fix this soon.

[@SEWebDesign]

I know! It's a been a while which is disappointing, but hopefully that means we are getting closer to this feature

[@AleZentenoBlog]

Great video pointing this out. This was my feedback in the beta testing phase, that Fluid Engine was great but not ready to go public because of the tablet view (among other not so problematic bugs). I was surprised they rolled out without fixing this issue. To give FE another chance, I planed to convert my templates to FE, but in the first section of the first template I tried to recreate, the tablet view was so bad I stoped completely and I'm going to wait for now... Not bringing any solutions, just sharing my frustration 😅

[@SEWebDesign]

Absolutely, it is definitely not ready yet! It turns out they had their q2 earnings call yesterday so there is some speculation they had to release it before that call so they could toute it to investers. Which makes alot of sense.

[@AleZentenoBlog]

@@SEWebDesign That would explain a lot! But still, I find it a questionable move, because movil responsiveness has been one of SS strongest qualities and FE (as it is now) could break this reputation, imo

[@SEWebDesign]

@@AleZentenoBlog yeah definitely

[@rolandvandenhout]

I am/was in the midst of an email exchange with SQS support to point this out. I noticed it when I flipped my iPhone 11 Pro into landscape mode. Shared your video with support! In a Twitter thread, they confirmed they are aware of the issue and that it is a top priority for them to solve. I also noticed that the Code Blocks can't be resized so if you have a small height section and include a code block, that code block will be taller than the text block and define the height of that section. Also communicated and confirmed as an issue by SQS.

[@SEWebDesign]

That is great news! Thank you for the update! Hopefully they will have a fix soon

[@hmg7871]

Tablet b/p would be great. Thank you again, Chris!

[@SEWebDesign]

I'm really hoping for that option!

[@mtdahlgren]

Thank you Chris for letting me know this issue and for your great work ♡ Hope Squarespace will fix this.

[@dmak2425]

It would be good to finally be able to design a cleaner look for the tablet view, so hopefully they can just create a tab b/p

[@SEWebDesign]

Yeah I've heard they didn't want to create more work for beginners designing their site but in my opinion more control is better. I think most would prefer to do the extra work for tablet view and have it look better

[@robkenyon6949]

We definitely need a tablet layout option. I do most of my web surfing on an iPad, so I’m guessing a lot of other people are doing the same thing. Making a website that looks crappy on a tablet makes zero sense.

[@SEWebDesign]

Totally!

[@samuelking7351]

I feel like this may have been a slightly over-engineered answer. Just change the preset default size/height of each section to “small”; as when they’re set to “medium” by default and within the parameters of tablets/mobile you will experience a preset CSS rule of min-height: 66vh

[@SEWebDesign]

The problem isn't the section height, it is the space between blocks within a section. Changing the section height doesn't solve that issue

[@lanahurteau4742]

This is not just a problem going from desktop to tablet, it also happens if your desktop screen is not at 100%. This is so annoying, my site was so beautiful and now it's janky AF because of the spacing inconsistencies.

[@SEWebDesign]

I didn't realize it came with zooming issues! I really hope they put more time into fixing this, or even better give us the tablet breakpoint. We really need it!

[@1deplatt]

I think their reasoning is that not many people view sites on tablet, so they didn't bother. However, they can't ignore the fact that every Fluid Engine Squarespace website looks like crap on a tablet. I think what will happen is that we will eventually get 3 breakpoints (and that's a lot of work to design 3 versions of each page) In this way Fluid Engine is a pretty big fail. It will need to be re-engineered.

[@SEWebDesign]

For me, a tablet breakpoint that we don't HAVE to use to fix errors, but that is available for extra layout flexibility would be perfect for my workflow.