vonvon Posted April 24, 2020 Share Posted April 24, 2020 Is there a way to keep spacer blocks placed below other blocks when viewed on a mobile device? I'm using version 7.1 and I'm new to using Squarespace. Thanks. Link to comment
tuanphan Posted April 24, 2020 Share Posted April 24, 2020 It seems spacer block is hidden on mobile? You can add this code to Home > Design > Custom CSS to remove hidden .spacer-block { display: block !important; } Florian 1 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
vonvon Posted April 24, 2020 Author Share Posted April 24, 2020 Thank you tuanphan. Is there a way to target one specific spacer block? Most of the time it's a plus that Squarespace hides the spacer blocks on mobile, but there are two areas on my site where it looks better if the spacer block is not hidden on mobile. Link to comment
Solution tuanphan Posted April 24, 2020 Solution Share Posted April 24, 2020 5 minutes ago, vonvon said: Thank you tuanphan. Is there a way to target one specific spacer block? Most of the time it's a plus that Squarespace hides the spacer blocks on mobile, but there are two areas on my site where it looks better if the spacer block is not hidden on mobile. Add to Home > Design > Custom CSS div#block-yui_3_17_2_1_1587735614716_5255 { display: block !important; } Each spacer block has specific ID. Find ID with this tool: https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde vonvon, stapers and Florian 2 1 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
tuanphan Posted April 25, 2020 Share Posted April 25, 2020 23 hours ago, vonvon said: Thank you tuanphan. Is there a way to target one specific spacer block? Most of the time it's a plus that Squarespace hides the spacer blocks on mobile, but there are two areas on my site where it looks better if the spacer block is not hidden on mobile. #spacer-block-id { display: block !important; } Find block ID with: https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde 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
stokemuch Posted March 1, 2021 Share Posted March 1, 2021 If you don't want to use code, and you understand basic graphic design principles I have an easy one that may also inspire some fun design solutions. Just create an empty image file, save as PNG, and insert that wherever you would use a spacer block; pull down on the grey circle at the bottom of the image to change the size of the image block to fill the space you need. Achieves the same purpose, and if the file is small enough it won't create any problems with page loading. I attached one below that's 1200x1200, and it's a 10KB file. Link to comment
Florian Posted November 19, 2021 Share Posted November 19, 2021 @tuanphan, you've just made my day! Thanks a lot! 🙂 Florian Zellweger florianzellweger.ch — florianzellweger.com influenz.design — janvier.black — ivoire.black Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment