Arjuna Posted November 14, 2022 Share Posted November 14, 2022 (edited) Hey friends, can someone please explain to me why the spacing here is appearing so much larger on the live site versus as in the preview? https://laepf.org/community-brigade I used CSS to create h4, h5, and h6 font styles and then inserted code blocks that very simply contain <h5> ...</h5>. On other projects this has worked fine but for some reason the spacing here is all messed up. See the attached screenshots of the preview versus the live site. Thank you friends! Edited November 14, 2022 by Arjuna typo Link to comment
Solution Ziggy Posted November 14, 2022 Solution Share Posted November 14, 2022 I'm not sure why you're seeing a difference in the editor vs live, but there are two reasons why there is space between the headings and bullet points, firstly they are all in different blocks (all blocks have a 17px padding, so that accounts for 34px of the space), and secondly the h5 has a margin top and bottom of 1.67em, you should be able to add this setting to the H5 in your Custom CSS: 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? Link to comment
Arjuna Posted November 15, 2022 Author Share Posted November 15, 2022 9 hours ago, Ziggy said: I'm not sure why you're seeing a difference in the editor vs live, but there are two reasons why there is space between the headings and bullet points, firstly they are all in different blocks (all blocks have a 17px padding, so that accounts for 34px of the space), and secondly the h5 has a margin top and bottom of 1.67em, you should be able to add this setting to the H5 in your Custom CSS: Thank you! I added margin-top: 0; margin-bottom: 0; to the h5 in CSS. It worked! Link to comment
Ziggy Posted November 15, 2022 Share Posted November 15, 2022 Fantastic! Can you mark my post as the solution to your question and give a thumbs up? Thanks! 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? 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