HOMENCREATIVE

@tuanphan I saw you responded to a similar issue in a different thread. Any idea why this might be happening?

I cannot get the text and add/remove buttons in the shopping cart to appear! Even though I've edited the site style to be navy text, everything appears white and cannot be seen. I tried adding custom code but it kept changing the font color of the footer, too. I don't see any font color assignment sections for the shopping cart when editing styles either. Please help! Password: teamorder URL: https://www.blueprintcookie.com/team-member-ordering

@Ziggy hmm, I see! So do you suggest I not use this method and create the auto-scroll using individual images?

@Ziggy sorry about that, I added ot to the forum post so I thought it included it! https://www.tasteedmonds.com/home-2024

I've successfully added CSS code to have an auto-scrolling logo carousel. I created the effect by creating two files that are 3000px wide X 300px H using a Canva template with the logos spaced evenly instead of uploading individual logos to avoid spacing issues. For some reason, the auto-scroll is showing off of the webpage when I scroll my mouse to the right. I cannot figure out how to fix this! Help! I created the effect by using the following code to custom CSS. /* Infinite Logo Scroll */ #SECTIONID .gallery-reel-list { animation: scroll 20s linear infinite; display: flex; width: 3000px; overflow: visible; } @keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-1500px); } }

@tuanphan I got the resizing of the image to work, but I'm struggling to figure out how to increase the wrapper size so that it doesn't cut off part of the image on the top/bottom (see far right 'Souvenir Shop') See image below. www.cafe-club.squarespace.com password: cafeclub

@paul2009 URL: www.cafe-club.squarespace.com password: cafeclub

@paul2009 I used your code successfully, however I had to increase the height of the button and add padding to the text to center it because it was showing up very narrow! Just FYI. Secondly, for some reason, it's showing a fill behind the text of the button even though I've updated both the "color" and "background-color" correctly. Any idea why this is happening? The code I have is: /*MOBILE STICKY FOOTER CTA */ /* Mobile CTA bar - Squarespace 7.1 */ /* Left (secondary) button colours */ .sf-mobile-cta-btn:nth-of-type(1) { background-color: #000000; color: #fffff; font-family: "Futura-PT"; font-size: 1.2rem !important; //size font-weight: 600 !important; // padding-top: 13px!important; } /* Right (primary) button colours */ .sf-mobile-cta-btn:nth-of-type(2) { background-color: #006837; color: #ffffff; font-family: "Futura-PT"; font-size: 1.2rem !important; //size font-weight: 600 !important; // padding-top: 13px!important; } @media only screen and (max-width:800px) and (orientation: portrait) { .sf-mobile-cta-wrapper { display: block!important; } } .sf-mobile-cta-wrapper { background: #ebebeb; bottom: 0; left: 0; position: fixed; width: 100%; z-index: 10; transition: bottom .3s; } .sf-mobile-cta { display: flex; flex-direction: row; align-content: center; justify-content: center; height: 50px; } .sf-mobile-cta-btn { flex-grow:1; flex-basis: 0; text-align: center; } /* End of navigation hover effect */

@tuanphan works perfect, thanks kindly!

@tuanphan thank you so much, it works!!

@tuanphan I have a similar issue and can't seem to figure out to fix it! I have a gradient header, and made the opacity 100% for the 1st section background. But I want to get ride of the weird line showing between header and section #1. Any idea? Website : www.cafe-club.squarespace.com password: cafeclub

@tuanphan thank you it worked! How do I adjust the size of the image?

Website: www.cafe-club.squarespace.com password: cafeclub @tuanphan I'm trying to replace my main navigation links with a custom hand-drawn image instead of a font. I tried using the custom CSS provided above but nothing is happening. I uploaded the .png files to custom CSS and used this code: .nav-item [href="/menu"] span { visibility: hidden; } .nav-item [href="/menu"] span:before { content: ""; background-image: url(https://static1.squarespace.com/static/658da47d0f5cf817eeeb2f99/t/65b02581c6873a3f75bab162/1706042753513/CUISINE.png); background-size: cover; background-repeat: no-repeat; width: 30px; height: 30px; display: block; visibility: visible; }

Hi! I'm looking for how to wrap a hyphenated word to the next line automatically without resizing the block. I'm specifically noticing this on mobile. See photo. I've had this happen on a few different sites I've designed, and I've only been able to fix it when I use a custom code block and add a line break. However, I'd like to apply this to a text block instead. Does anyone know how to do this or what custom CSS to add?

@Ziggy Hi there - thanks for helping! I do have custom CSS applied to the website, as well as for this portfolio page. It happens when you click to view each project and scroll to the bottom to click the "next" project. Here is the website and link for what I mean > https://www.lemonpopcreative.com/our-work/aventura-mall It only happens on mobile.