Jump to content

Recommended Posts

Posted

Hi

I am uing Fluid Egine to layout my pages. But it seems that for example if I add an image the a text block beeath that I can position it so in touches he botom of the image as it seems to snap to the grid size I have got.

Finding myelf using loads of CSS to position elements precisely.

Am I doing something wrong?

Thanks

  • Replies 7
  • Views 997
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Posted

Can you share your website URL and maybe a few screenshots to demonstrate the issue you are having?

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!

📈 SEO Space (Referral link)
Ⓜ️ 
Will Myers' Plugins & Tutorials (Referral link)
 🔌 Ghost Squarespace Plugins (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲SQSP Themes (Referral link) 
Spark Plugin (Referral link) 
 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) 

 Did I help? Buy me a coffee?

Posted (edited)
6 hours ago, DavvaMC said:

But it seems that for example if I add an image the a text block beeath that I can position it so in touches he botom of the image as it seems to snap to the grid size I have got.

Finding myelf using loads of CSS to position elements precisely.

Hi @DavvaMC oh no! You shouldn't have to use CSS to position elements.

I've taken your example of placing Text Block beneath an Image Block, see below.

Grid - has gap

By default, the Gap for a section is set to "has gap", which has a gap between the rows and columns. You can't place a Text Block directly below or touch an Image Block in this setting.

image.png.80391a4f4999538547149f2894b5ad47.png

Grid - has no gap

If you want blocks to be touching each other, you can change the Gap setting to "no gap". Edit Section > Design > Gap > choose the 1st one that shows no gaps.

You can now place blocks up against each other with their blue boxes touching. 

image.png.0abcc2388485623fd5403f3a40127c44.png

Let me know if this helps address your issue. 

Edited by melody495

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Nerd

💻 💁‍♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn?
👩‍💻 💁‍♀️ Website help <- send me your to-do list. From code to plugin to domain setup.
🧰 See the tools I use (contain affiliate links)
 Did I help? I like coffee (Thank you)

Posted

Thanks if I select no-gap it means when i add an image and text blcok in one halpf and an image and text blok in another half the vertical gap is also 0.

Would I need to add custom cs to give a space in between (vertically)

Hope that makes sense.

Posted (edited)
1 hour ago, DavvaMC said:

Thanks if I select no-gap it means when i add an image and text blcok in one halpf and an image and text blok in another half the vertical gap is also 0.

Would I need to add custom cs to give a space in between (vertically)

Hope that makes sense.

Please share a screenshot of what issues you are seeing, and how you want them to look.

Edit: btw I updated my previous post with the relevant screenshots.

Edited by melody495

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Nerd

💻 💁‍♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn?
👩‍💻 💁‍♀️ Website help <- send me your to-do list. From code to plugin to domain setup.
🧰 See the tools I use (contain affiliate links)
 Did I help? I like coffee (Thank you)

Posted

Thanks, I have selected no-gap and horizinal gap = 11

But the image and blach boxes also need the same gap. But if I do that the text above the image blocks space increasing and I cannot then align the sub text closer to the title as it is snapping to the grid!

Phewww hope that make sense!

Home-—-CN-8-Leadership-Confidence- (2).png

Posted
19 minutes ago, DavvaMC said:

Thanks, I have selected no-gap and horizinal gap = 11

But the image and blach boxes also need the same gap. But if I do that the text above the image blocks space increasing and I cannot then align the sub text closer to the title as it is snapping to the grid!

Phewww hope that make sense!

I can't tell without the grid enabled or a URL. 

But if you have set vertical to be no gap, then it seems like the text block above your image is too big. Drag it from down so it can no longer be any smaller (red line). Then set the alignment of the text to the bottom. This should give you the least amount of space between the text (top) and the image (bottom).

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Nerd

💻 💁‍♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn?
👩‍💻 💁‍♀️ Website help <- send me your to-do list. From code to plugin to domain setup.
🧰 See the tools I use (contain affiliate links)
 Did I help? I like coffee (Thank you)

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.