MissTippyTap

Hi CSS Friends! I've customized a client desktop website, so the menu displays with a custom burger icon. The desktop display looks wonderful, but the mobile display not so much. On the mobile, the custom burger icon is larger than I'd like for it to be and feels off center with the logo centered. Is there a way I can either 1.) reduce the burger size in mobile or 2.) Left Align the currently centered Logo? Thanks so much.

https://fourleafcloverproject.squarespace.com/ Password: fourleafclover SOS! My client request a burger menu for the navigation in the form of the brand icon on the left, Site Title in the Center, and the CTA button on the right. I've got this format setup, however the Site Title is off center. How do I fix this? Here's the code I'm currently using: //CUSTOM DESKTOP NAV MENU// .header-nav { display: none; } .header-burger { display: flex !important; } .header--menu-open .header-menu { visibility: visible; opacity: 1; } //BURGER ORDER// @media screen and (min-width:992px) { .header-title-nav-wrapper { align: center !important; order: 2; } .header .header-burger { order: 1; } .header-actions.header-actions--right { order: 3; } } // CUSTOM HAMBURGER// /* Non-active burger */ .burger-inner:after { content: ""; background-image: url(https://static1.squarespace.com/static/66b0f13e45cb493d90506dfa/t/6706cde7b4e6ae3aa33b3e98/1728499175846/FLCP-burger.png); background-size: 100px; background-repeat: no-repeat; background-position: left; background-color: transparent !important; display: block; width: 100px; height: 60px; } .burger-inner>div { display: none !important; } /* Burger when active */ body.header--menu-open .burger-inner:after { background-image: url(https://static1.squarespace.com/static/66b0f13e45cb493d90506dfa/t/6706cde7b4e6ae3aa33b3e98/1728499175846/FLCP-burger.png) !important; } .burger-box { width:100px; }

Hi All, I'm running into a similar issue. I've purchased the font Elyaris from Creative Market. It has over 300 glyphs. Right now, the font is displaying in the basic character set (pictured left). I would like to incorporate more of the "swirly" characters (pictured right). I've followed this tutorial and have not had success activating the glyphs: Any suggestions or recommendations on how to turn on the glyphs for this font?

SITE: https://odyssey-resilience.squarespace.com/config/pages Hi all! I'd like to add a drop shadow effect to the testimonial carousel cards on my site. I've used the Squarespace ID finder to find the section ID, however, with this type of carousel it appears there is no block ID available. So when I use the following code, I'm afraid it's adding the drop shadow to the entire section versus targeting the carousel cards inside the section. Code Used: section[data-section-id="65cce3933203a900145ffc4e"] * .image-block-outer-wrapper { box-shadow: 0px 4px 8px 2px rgba(0,0,0,.1); } Any suggestions on how to specifically target the carousel cards without having the ability to obtain their ID? Thanks so much!!