Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'custom-css'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Topics
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Topics
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me



Found 775 results

  1. Site URL: https://www.chicagochamberchoir.org/cart On my cart page, the top part of the page is partially under the header. I can use the following CSS to fix it: ___________ /* Header Background on Cart Page */ body#cart .Header { background: #ff0000; } body#cart section.Main-content { padding-top: 150px; } ___________________ However, when I add that code to the custom CSS, it seems to break the code I'm using to make the shopping cart float with the user as they navigate the page (see here). This is my current CSS; how can I get the banner spacing I need without breaking the shopping cart float? ___________________ @media only screen and (min-width: 760px) { header{position:fixed!important;z-index:9999;width:100%;-webkit-box-shadow:0px 3px 15px rgba(100,100,100,.49);-moz-box-shadow:0px 3px 15px rgba(100,100,100,.49);box-shadow:0px 3px 15px rgba(100,100,100,.49)} /* Cart */ .Cart { transition: 0.35s; } .sqs-pill-shopping-cart { display: inline !important; opacity: 0.95 !important; position: fixed; top: 110px; right: 20px; }}@media only screen and (max-width: 480px) ___________________
  2. Question - When I enter the code on the Design > Custom CSS it displays a "?" (missing photo icon), know of a way to resolve this?
  3. Site URL: http://www.agentsie.com Hi! Might anyone have insight as to how I can change the last item on my main navigation to RED while leaving everything else as is? (@tuanphan?) - Om Template- www.agentsie.com
  4. Site URL: https://www.pilotoasia.com Hello Currently I have built a dofollow link on one of the images at my homepage. I would like to build a nofollow link on a new image. How do I do that? I saw some tips online about CSS code. But it looks like the CSS code applies to all the links in the same page. Cheers
  5. Hello, I have successfully used this code to add pop-up text boxes when clicking on buttons/images on multiple Squarespace websites, but seem to be facing some issues with it on the website I am currently working on. Here is the code I used in the block: <div> <a href="#/" data-featherlight="#bio-zeinab"></a> </div> <div style="display:none;"> <div id="bio-zeinab"> <p> "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p> </div> </div> Here is the code inserted in the page's header (line 1 is to remove the menu and footer on the page): <style>.header, #footer-sections {display:none!important;}</style> <link href="//cdn.rawgit.com/noelboss/featherlight/1.4.0/release/featherlight.min.css" type="text/css" rel="stylesheet" /> <script src="//code.jquery.com/jquery-latest.js"></script> <script src="//cdn.rawgit.com/noelboss/featherlight/1.4.0/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script> Currently, when I add the code to my page, a pop-up successfully appears, but the text is invisible (image 1). When I move my cursor over the text, the text select icon appears, and I can drag along the invisible text (yet no selection highlighting occurs). I know that the text is present - when I right click I can "look up" the selected text (image 2). Does anyone know how to fix this or why this is happening? Any help would be greatly appreciated! Thank you!
  6. Hi guys, I managed to reduce the width of my cookie banner, however it seems that the X icon is now misplaced, and it is too big and thick. I have searched high and low on how to change the thickness, size and alignment of the X icon. Would really appreciate your help on providing a CSS code that can do just that. I have circled the area with a yellow marker. Thank you very much~! Regards, Jackson
  7. I've been watching a couple Squarespace videos on how to do small customizations on my website via the Custom CSS section and I type in the code exactly and it constantly gives me the Syntax Error on Line 1. Not sure what I'm doing wrong? Here's the code I was trying out. .sqs-block-button-element--medium(background-color:#f69477) Thanks
  8. Site URL: https://www.camberwellarts.org.uk/test123 Hi, is there a way to increase padding against specific text blocks? Looking to still left align but centralise the text more vertically. Have previously attempted with code block container + custom code but this didn't scale great on mobile. Site example here: https://www.camberwellarts.org.uk/test123 Thanks!
  9. Site URL: https://www.nolonstacey.com/hares/sitting-hare-ii-b Hi, I'm having an issue with my product carousel arrows not being visible. It's fine with a product with a dark background, like the Red Kite, but many of my images have white backgrounds so the white arrows vanish. This would have been an easy fix in 7.0, but I can't for the life of me find a way to change the colour of (or add a background to) the carousel arrows so they're visible no matter what the background. I've searched and searched, so any ideas would be greatly appreciated. Thanks in advance (and anticipation!!)
  10. Site URL: http://www.jensymes.com/home I am wanting to expand the parent container for my carousel gallery to expand the view in mobile only and leave the gallery dimensions alone in tablet and desktop view.
  11. Site URL: https://www.papahale.org/ Hi there, My banner video will not be showing on full size aspect on mobile view. Could somebody help me getting through this? Do I need specific CSS coding for this? Pass: mamahale Desktop view Mobile View
  12. Hi there, When I change the background image of a section from full bleed to inset, it creates some white space that I'd like to get rid of. See image for reference. Thanks!
  13. How do I target/hide/remove the "," between tags on a grid summary block in 7.1? I've successfully edited the tags themselves with .summary-metadata-item--tags a{ color:#3b5ed8!important; background:#ced7f5!important; } But can't figure out how to target that pesky comma! (site is under NDA, cannot link to)
  14. Site URL: https://www.loganreulet.com/ I've tried multiple codes in the forum, but no luck getting any of them to work. I have an asymmetrical image layout that i'm trying to maintain across mobile and tablet instead of defaulting to a single column of images.
  15. Hi there, I am trying to disable the responsive mobile design of a specific page on my website. I have tried several custom css codes but nothing seems to work. I just want the icons you see here to stay the way they look when you visit the page using a phone or a smaller screen. I want the layout of the images to stay the same regardless of the screen size. Could anyone help me? Thank you so much!
  16. Site URL: http://www.letsgruv.com I have 3 images with click-through links on my homepage. The name of the page that the image is linked to is displayed in a caption that appears on hover but I'd like to have that always visible on mobile. I'm sure this is an easy fix but the few things I thought to try don't seem to be working out. Thanks for the help!
  17. Site URL: https://www.bluestonemanagement.com/ Hello! I am trying to create a hover effect over the first six images (Project Management, Quantity Surveying, etc.)so that when hovered over, they go from greyscale to colored. I'm having trouble finding/selecting the correct class (because nothing is happening when I do anything to the classes I find). What is the custom CSS needed to achieve this goal?
  18. Site URL: https://www.vill.no/vill-arkitektur Hi! I have this page where you press one of the projects and then you enter the specific projectsite. I'm encountering a strange issue where you press the project and enter it but no banner shows up. Try f.ex. "Rekkehus Bergen". If you refresh the page the banner will show up though. On some of my other pages like the landingpage vill.no i have some code injection to block the banner from showing up, but this is not applied globally to the site. Anyone seen this before? Best regards, Anders
  19. Site URL: https://www.simplify.ws/ I'm trying to figure out how to randomize the testimonials displayed on my home page. I used the blog feature as a way to create and organize the quotes because I preferred it to the other options. I want to display a random quote rather than forcing a specific order. Has anyone accomplished this using CSS on 7.1? I'm new to CSS but willing to give it a shot. The Testimonials block is currently setup with a carousel so that it works best on both mobile and desktop. I expect to have around 6-8 testimonials at any given time. Thanks!
  20. Site URL: https://www.inclusivecreative.services/ Hi, I'm trying to figure out how to add a hover effect to hyperlinks in the body of my site (navs are fine). Right now the only design option to indicate links is a color and I feel it looks like a design feature not a link. I've tried adding some css to make this happen, but I'm not sure which selector to choose. I'm using the Hayden template
  21. Hi, I have a custom html list whose items I try to show in three columns with flexbox. List items have padding to add room for item background. li { flex: 0 0 calc(33% - 66px); padding: 0 16px 0 50px; background: url('check.png') no-repeat left top; } The problem is that squarespace has some kind of preprocessor which converts calc() to this: (style copied from browsers inspector) flex: 0 0 calc(-33%); How should I write calc() to keep it in the desired format?
  22. Site URL: https://www.poppieskold.com/ Hallo! Can anyone on here help create a copyright footer on my website - www.poppieskold.com - which is using the Wells template? Here's the copyright text: © Poppie Sköld 2020 Squarespace support won't troubleshoot how to do it as it needs custom code, but have suggested using this forum! Anyone on here able to advise? Thanks in advance! Poppie
  23. Site URL: http://www.littleemberslearning.co @tuanphan I am trying to make a two-toned background on a specific page using SquareSpace 7.1. I can't seem to target the right element. It works ok on desktop but not on mobile. It seems like it's not targeting the entire background. Here is the code I'm using: /*Background half color*/ div#page-section-5ebb04baaf3da51700fbbdba{ background: linear-gradient(0deg, #264a53 60%, #fff 40%); } @media only screen and (max-width: 640px){ div#page-section-5ebb04baaf3da51700fbbdba { background: linear-gradient(0deg, #264a53 80%, #fff 20%); } } Any help would be appreciated!
  24. So I basically have a custom calendy button to add to my page, upon adding the ahref link to the button settings in the block, it works but a text (' "> ') shows next to the button, so after improvising I noticed I can add the code of the seciton/block including button and add it to the advanced section so customise button and fix the problem, which it did! However the issue now the CSS of all the DIVS etc isnt adding/taking effect to how it should be like when the block was made For an example see here - the page im reffering too.. the first 2 sections is the blocks were what I added manually with code, here you can see the css not applying as it shoud, but then the blocks below which are the originals; you can see the css added all fine. Would be great to get some advice/help on this! Thanks!
  25. Site URL: https://sparrow-piano-jh6p.squarespace.com/rewards Hey there! The password to the above site is villamadina. I used this code to make some coloured text boxes. <div id="overlay"><div class ="blue"> <h2><span class= "headeroverlay-white">my text here</span></h2> </div> <style> .blue { background: #005ba9; padding: 10px; text-align: center; } </style> The "headeroverlay-white" is just "colour:white" in my custom css. When I'm in squarespace it looks fine but I just checked the site in incognito and found for some reason all the boxes are getting smaller? How do I fix this? Thanks!
  • Create New...