Alasana Posted October 22, 2023 Posted October 22, 2023 (edited) Hello, I am trying to set a text block in SS7.1 (fluid engine) to have columns and dynamically flow the text from one column to the next so that a large text block is easy to read. I referenced this tutorial How to create a multi-column text block in Squarespace, without using separate blocks • Beatriz Caraballo but it isn't working for me. I suspect that it may have something to do with fluid engine and I am not targeting the block correctly, as if I reference this block in CSS and try to customise, nothing changes. I know I am doing something wrong - can anyone confirm that the referenced article should be the correct way for 7.1 FE or have things changed? The section I am trying to adjust is just a blank section with a text block in it. CSS from article for reference: /*MULTIPLE COLUMNS ON SCREENS LARGER THAN PHONES*/ @media screen and (min-width: 640px) { #block-XXXXXXXXXXXXetc { column-count: 2; column-gap: 60px; } } Thank you. Edited October 23, 2023 by Alasana
Web_Solutions Posted October 22, 2023 Posted October 22, 2023 2 minutes ago, Alasana said: Hello, I am trying to set a text block in SS7.1 (fluid engine) to have columns and dynamically flow the text from one column to the next so that a large text block is easy to read. I referenced this tutorial How to create a multi-column text block in Squarespace, without using separate blocks • Beatriz Caraballo but it isn't working for me. I suspect that it may have something to do with fluid engine and I am not targeting the block correctly, as if I reference this block in CSS and try to customise, nothing changes. I know I am doing something wrong - can anyone confirm that the referenced article should be the correct way for 7.1 FE or have things changed? The section I am trying to adjust is just a blank section with a text block in it. CSS from article for reference: /*MULTIPLE COLUMNS ON SCREENS LARGER THAN PHONES*/ @media screen and (min-width: 640px) { #block-XXXXXXXXXXXXetc { column-count: 2; column-gap: 60px; } } Thank you. Can you share your website URL? And tell me where do you want apply this? If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks MD Rofik Website Designer and Digital Marketer ☕Am I helpful? Want to offer me a coffee? ✉ Send me a message if needed any help. I'll try to reply as soon as possible.
Alasana Posted October 22, 2023 Author Posted October 22, 2023 Thanks for your help. I set it as a test page for you to review. https://www.alasana.com/test block is :#block-319fe46991029a14bcac
Solution Alasana Posted October 22, 2023 Author Solution Posted October 22, 2023 I believe I have solved this. I put in different syntax. I changed it to .fe-block instead of #block as per below. Now it is working. .fe-block-319fe46991029a14bcac
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment