Jump to content

bybelser

Member
  • Posts

    4
  • Joined

  • Last visited

bybelser's Achievements

  1. Update: I think it's somehow taking the blue button from the "E-Mail Palette" Before I was changing the E-Mail styling for notification when back in stock. Besides the "website color palette" there was an "E-Mail Palette" with that blue color that I could choose from. I erased it from there but still showing in the blue color on the published site. I don't have that color anywhere else in my color palettes
  2. Page: www.ravens-2.squarespace.com Passwort: Ravens-1 First Image: Mobile in Editor view - Second Image: Mobile on the published page Somehow the button is a different style and color than in the editor. I was able to fix the overflow on mobile with this code (third image) /* Mobile products input */ @media screen and (max-width:767px) { .product-details .product-restock-notification:not([hidden]) .product-restock-form>input[type='text'] { min-width: unset !important; width: 80%; }} But I can't imagine I'm the only one with this issue? Any solutions? Thanks community 😃
  3. Edit: Chatgpt just helped me with this code and it works half ways: /* Right alignment for desktop */ div#block-8848eabd2318998ac7f2 .sqs-svg-icon--list { display: flex; justify-content: flex-end; /* Aligns items to the right */ } /* Center alignment for mobile devices */ @media only screen and (max-width: 640px) { div#block-8848eabd2318998ac7f2 .sqs-svg-icon--list { justify-content: center; /* Centers items */ } } Result: It's now at least semi-centered but not perfectly Example 1: Centered with Code Example 2: Centered traditionally It's subtle but still noticeable. To make it work perfectly centered I need to add the following code and I can't imagine this is the correct way to do it: @media only screen and (max-width: 640px) { div#block-8848eabd2318998ac7f2 .sqs-svg-icon--list { display: flex; justify-content: center; transform: translateX(-6px); /* Adjust as needed */ } } __________________________________________________________________________ Second: Just out of curiosity, why does the other solution not work anymore? There are multiple forum posts, pointing to this solution. Also with me it worked perfectly up until 2 days ago. Did Squarespace change something? I tried everything, even created a completely new Squarespace account and followed the guidelines posted below to the dot without results. Here are some examples pointing to the solution that previously worked but now not anymore: https://www.risingtidecreatives.com/blog/center-align-text-buttons-mobile-squarespace etc.
  4. Hi all, I'm trying to center the social link Icons only in mobile with code. Up until 2 days ago this worked perfectly with the following code: @media screen and (max-width:640px) { div#block-8848eabd2318998ac7f2 * { text-align: center !important; } } I once tried this code, which also worked: /* Right alignment for desktop */ div#block-8848eabd2318998ac7f2 .sqs-svg-icon--list { text-align: right; } /* Center alignment for mobile devices */ @media only screen and (max-width: 640px) { div#block-8848eabd2318998ac7f2 .sqs-svg-icon--list { text-align: center !important; } } However, as of two days ago, the icons will not center anymore on mobile using this code. I've deleted the whole page and rebuilt it. I've tried new templates with the same code. I've searched various tutorials and applied the codes provided. Text is affected, but the icons remain unaffected. What am I missing? Thanks for any help provided. Link: https://ravens-2.squarespace.com Password: Ravens-1
×
×
  • 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.