Ognio

Thanks for the input, I was messing around with css and then gave up...

Ever since the rollout of 7.1 every single website I design looks terrible on tablets. Like not even close to responsive...it makes it sooooo hard to compete with other developers in my area using other platforms. This includes how content stacks, image sizing issues, and spacing issues. All my websites look great on desktop and mobile but break in between. Does any one know how to fix this? Primarily for today I would like to fix how images get cropped (I have attached photos as an example of what happens). Does Squarespace have a solution for responsiveness across tablets coming? Getting ready to leave the platform soon as this is so frustrating... @Sarah_SQSP Website: https://www.ogniocreativeco.com/ Similar issues exist on my other sites I have made for clients... https://www.quest4change.ca/ https://www.inspiredstepsorthotics.ca/ Any help would be great at this point I guess.

I am all of a sudden having the same issue.

@bangank36 Thanks for your reply. I actually managed to fix the issue shortly after posting. Basically I had to target my h1, h2, h3, and h4 classes on each individual page. The global change to the website no longer worked...strange but I think the Fluid Engine rollout caused issue. Thanks!

Site URL: https://www.quintilianschool.ca/ I recently launched a website for a client and all was well in the world. No issues, no bugs...client got what they asked for (even if some of it wasn't my favourite...lol). Anyways, all of a sudden there are centering issues site wide for 1368px and below. Mostly it is just text headers but also a few images are acting weird. Issue only presented itself after this new Fluid Engine update...smh...so silly. Website is running on 7.1 Classic Builder. I am using basic code for my centering of text on certain aspect ratios (as seen in attached image). Idk if I'm dumb or the Fluid Engine update is...either way I'm super frustrated and ready to leave the platform. Any help would be great...thanks.

Solved but open for other solutions or additions.

Hi Squarespace Friends, I spent hours combing through the forums for a solution on how to make website content stack on tablet like it does on mobile for Squarespace 7.1. Unfortunately, I never found anything that actually worked the way I wanted or needed it to. I realized that so many other people have this issue so I told myself I was going to be the one to solve it and I did. All you need is a little bit of CSS... Please note, I'm not an expert in CSS and I didn't know how to make this occur for every page at once, so the code would need to be used repetitively for the different pages (#collections) you have. Here is the code: @media screen and (min-width:768px) and (max-width:1180px) { INSERT #COLLECTION-ID HERE .col { width: 100%; display: flex !important; flex-direction: column !important; } .sqs-layout .sqs-block-spacer { display: none !important; } .image-block { width: 60% !important; margin: auto; } } Explanation of the code: The first part of the code is used to target what screen sizes you wish for your content to stack at or in between. You can see in my example that I am only targeting screen sizes 1px above the standard mobile breakpoint in 7.1 and up to a 1180px. If you wish to content stack at an even lager size then just increase the 1180px number in my code to a size of your own choosing. Please also be sure to update the code with your own collection id or else it will not work. The second part is used to remove all spacers you may have used on your page. This is commonly done by default at the mobile breakpoint in 7.1. If you wish to keep your spacers then just remove this part of the code. The final part is used to reduce the size of all images on the page. I found that without this part, most images are too large as you force the content stack. If you wish to keep all your images large then just remove this part of the code. Please note that "margin: auto;" will center you images like in my photo result. You can use left and right CSS commands to adjust this. Here is the transformation: In this example you will also notice I centered all the text. To do this just target the desired text class with a media query and match the "max-width" property to the value you used in the code above. Here is an example: @media only screen and (max-width: 1180px) { p { text-align: center; } } @media only screen and (max-width: 1180px) { h1 { text-align: center; } } @media only screen and (max-width: 1180px) { h2 { text-align: center; } } @media only screen and (max-width: 1180px) { h3 { text-align: center; } } @media only screen and (max-width: 1180px) { h4 { text-align: center; } } Hopefully this helps the community and works for everyone. Thanks, Branden

Hello, NOTE: Location is Canada. I am looking to see if anyone knows if Squarespace will actually work to sell fashion clothing and accessories on a large scale? The company I am building a site for has a storefront with over 14,000 inventory items. They are in need of a new POS system that ideally would work well with Squarespace. All I have found is Square POS offers such integrations but how inventory is tracked between the two seems less than ideal. To upload an entire catalog of items through Squarespace seems like a nightmare. I have built many sites using Squarespace but not a e-commerce site this large and extensive. I'd like to build this site here to but I am not sure what steps I should take in doing so. From everything I can tell, Squarespace looks like a great e-commerce platform for a limited/small amount of products...but for my project it seems as though I need to look elsewhere. Perhaps building everything through Square POS & Web. Any thoughts, comments, and or suggestions would be appreciated. Thanks.