GretchenElizabeth

Hi @Rustynz 👋 You're definitely not alone, I have been dealing with the same issues with the irratic spacing! I came here searching for answers after troubleshooting with a client all morning and it's not the first time we've had problems with it. The spacing looks perfectly fine in the editor and then will look crazy in the wild and on different browsers. Been designing in Squarespace for years and never had an issue with this before I started working with the Fluid Engine. I tried adjusting the grid gap spacing and it seems to work better with a compact grid but it still isn't perfect. Tagging @tuanphan @creedon @paul2009 in case y'all might have any insight into possible fixes/best practices with this? Thanks all!

AMAZING!! Worked like a charm. I am so grateful for your help!! Thank you so much @tuanphan 🙏

@tuanphan just this one product in the screenshot!! thank you!!! 🙏

Hi Squarespace friends! @creedon @tuanphan I am seeking your help, I tried implementing a few of these codes but still seem to be missing something. I am wanting to move the "additional information" section on this product so the booking calendar section appears before the quantity and add to cart sections. Any help is so appreciated!!! 🙏 https://www.alexandra-lyon.com/offerings/p/inner-wisdom-session

@creedon Thank you for your reply and for looking into it! I'm not sure how but it seemed to work itself out on its own, as it looks fine for me on Safari now too. I'll take it! 😅

@tuanphan Hi, I haven't figured it out quite yet! Any idea what could be the issue? Thank you 🙏

Site URL: https://www.alexandra-lyon.com Hi! Seeking help with this, any insight is so appreciated! Just noticed the buttons on my clients site look different on Safari and Chrome. On Chrome they show up like this: https://www.alexandra-lyon.com/ https://www.alexandra-lyon.com/course But on Safari they show up like this: https://www.alexandra-lyon.com/ https://www.alexandra-lyon.com/course This is the code I used to further customize the site styles: //Button outline// .primary-button-style-outline .sqs-block-button-element--small, .primary-button-style-outline .sqs-block-button-element--medium, .primary-button-style-outline .sqs-block-button-element--large, .primary-button-style-outline .image-button a, .primary-button-style-outline .newsletter-form-button, .primary-button-style-outline .list-item-content__button { border-width: 1px; border-style: solid; } .primary-button-style-outline .dark .sqs-block-form .sqs-editable-button { background: transparent!important; color: #ffffff!important; border-color: #ffffff!important; font-family: ss-pro!important; font-weight: 600!important; font-style: normal!important; text-transform: uppercase!important; line-height: 1.2em!important; letter-spacing: .25em!important; font-size: .8rem!important; } .primary-button-style-outline .dark .sqs-block-form .sqs-editable-button:hover { background: #ffffff!important; color: #888!important; border-color: #ffffff!important; } Any help is so appreciated, thank you!!

Thank you so much @tuanphan!! Works perfectly!! I so appreciate your help!!

Thank you @tuanphan! I really appreciate the help. Is it possible to have the announcement bar show up like normal when browsing on mobile but be disabled or covered up only when the menu is opened, like below? Thank you again for all your help! 🙏

Hi, it is disabled on the first page but shows up throughout the rest of the site like so: https://www.alexandra-lyon.com/course Thank you for your response 🙂

Site URL: http://www.alexandra-lyon.com Hi! Seeking help on this, is it possible to either hide the announcement bar when visitors are accessing the mobile menu or have the mobile menu cover the announcement bar completely? I still want the announcement bar visible on mobile just not on the menu. I'd like to achieve the effect below: Right now, the mobile menu displays like this: Any help is appreciated so much! Thank you!