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

Search the Community

Showing results for tags '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

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me



Found 588 results

  1. Can anyone help me with the css to prevent header from displaying on one of my pages? Www.k-interiors.com/deepbranch is the page. Thanks in advance for your help. I have experimented with similar code I found in other posts, and haven't had luck yet... a little clumsy with CSS!
  2. Hi all! I am trying to find a way to create a fixed border around my entire website. Here is an example. I almost got it with the CSS from here, but can't quite figure out how to fix the bottom of the border to the edge of the window. Thank you so much for your help!! Olivia
  3. Does anyone know some CSS Code to customize the current “Caption Overlay on Hover” option for images on the Pacific template? I’d like the caption overlays to appear over 100% of the image when I hover. The width spans the entire length of the picture, but the height only spans about 50% of the picture, depending on how much I write in the text box. This is driving me nuts, and it makes my mobile site look horrible! Ideally, I’d like my caption overlay on hover to fit 100% of the image like this: http://www.vergecollective.com/#expressions-page I've tried the following CSS code, but it isn't working: .sqs-block-image .image-block-outer-wrapper.layout-caption-overlay .intrinsic .image-caption-wrapper { height: 100% !important; } Any help or suggestions on my CSS code? Thanks!
  4. Hey all, I'm having a hard time getting a section of code to work properly for Internet Explorer 11. Here is the code below: #collection-553955fce4b0147a4ad80062 .sqs-block.image-block { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); } #collection-553955fce4b0147a4ad80062 .sqs-block.image-block:hover { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); } What I'm trying to do is target a specific area of the page to have the pics show in black and white, but then change to color when you hover over them. It works just fine when I pull the page up in Google Chome but not with Internet Explorer 11. Anyone have a suggestion?
  5. My CSS seems to work fine on all my browsers, but it is messing with how it displays on my mobile device. Particularly, I am referring to the navigation folder. Is there CSS that will tell it to ignore mobile devices? Or do you have any suggestions for how I could alter my CSS so that it will have the same results without affecting mobile display? Here's the website Here's the is the relevant CSS: #header {border-bottom: 5px solid #a8aab1; padding-bottom: 0px;} #header .primary-nav .nav-link, .folder-wrapper {line-height: 35px; margin-top: 51px !important; border-top-right-radius: 10px; -webkit-border-top-right-radius: 10px; border-top: 1px solid #a8aab1; border-right: 1px solid #a8aab1; border-left: 1px solid #a8aab1; height: 40px !important; background-color: #d1d3da !important; height: 30px !important;} #header .primary-nav .nav a:link, .folder-wrapper .show-folder {padding-left: 5px !important; padding-right: 5px !important;}
  6. I’m using the Five template. I’d like to hide the navbar on the opening page (splash page) only while keeping it visible with text and background image on all the site’s other pages. I’ve tried adding certain adjusting the CSS in the style editor: .collection-506daf5a84aead5098d68b94 #nav-bar {display: none} And in the advanced section of the Page Settings, I’ve tried an injection code: <style> #header { visibility: hidden; } </style> But nothing has happened. The ID is correct and at this point I’m lost. Any ideas out there? I’m grateful for your help.
  7. Hi. I am using the Aviator template, and it allows for styling all three headings (h1, h2, h3) as different fonts and sizes, however, it will only allow for all three to be the same color. Does anyone know how to override this, so that I can have one heading be a different color than the other heading styles? Thanks!! :)
  8. I am trying to add this image http://i.imgur.com/hdbiAn2.png as my footer, I want it to tie in nicely with the rest of my design.But the problem is all the css I have found to do this just doesn't work. The main css I have found for this is #footer { background-image: url(http://i.imgur.com/hdbiAn2.png) }Now when I try and add a background color and edit the text with css, it works fine. But when I attempt to add a background picture to my footer, it just stays blank.
  9. I have been trying to change footer settings: background color, font color etc - but without success - can someone please provide example code to do so?
  10. Hey Folks, I tried a lot but I just can´t find the solution - I guess it could be very easy.Maybe you can help me out: I have an embedded squarespace blog on my page and use the "excerpt" function for teasing my guests. Apparently there ist this "Read More..." Button and I simply want to change the text into something else e.g. "Read the whole story...". How can I solve this? Greetings, Alex
  11. I'm using the Five Template, and I'm having all kinds of problems with my custom header in mobile. Help referred me here and said custom CSS could fix my issue. I know nothing of web design so that's why I'm here. Is there a way to disable the header all together for my mobile version only? That way I'll only have the Nav Bar at the top?
  12. I'd really like to reduce the Bedford template's homepage's banner height, while retaining its headline functions, and keeping the site mobile-friendly. I know a little html and css, but am not a developer; I've tried some "code injection" tips from the forum about increasing the banner size, but have not been able to get anything working. Any advice? As background, I'm working with a client who really likes this template. Her site is pretty simple, so we are using copies of the homepage-style template for every page in the site. She doesn't have a lot of content in the banner area though, and I feel that the banner takes up too much screen space, pushing the subsequent content too far down the page.
  13. Hello, I'm very new to CSS and HTML coding. In fact I'm very new to building a website. Can anyone tell me how I might be able to add breadcrumbs to my sight? Or have any other suggestions for navigation. I'm trying to create and online store the DIY way (because I'm in the UK and don't benefit from SQSP e-commerce). thestitcherymachine.co Thanks in advance people!
  14. I'd like to make the background image to my commece/product page different from my normal page. I was told by adding some custom CSS coding this is possible. However, I know very little to coding. Could someone please help me with this. www.iambroadway.com.
  15. Hi guys, I'm trying to get a smooth hover effect over my linked images. My website is www.mensthetics.com, and if you hover over my images you can see how abrupt the opacity change is. I've pasted this code that I found somewhere to achieve that: a:link img { opacity: 1.0; filter: alpha(opacity=100); /* For IE8 and earlier */ } a:hover img { opacity: 0.8; filter: alpha(opacity=80); /* For IE8 and earlier */ } I'm trying to achieve something more similar to http://www.muscleforlife.com/ PS. Also, if there is a way to get the same gradual/fade color change effect for my links that would also be much appreciated!
  16. I'm stumped on this. I want to use the spacer blocks that are included on the website, but I have no idea how to get custom CSS to affect it. Here is the Element I am trying to affect <div class="sqs-block spacer-block sqs-block-spacer" data-aspect-ratio="2.08955223880597" data-block-type="21" id="block-yui_3_10_1_1_1398457714933_10509"><div class="sqs-block-content sqs-intrinsic" id="yui_3_10_1_1_1398459846313_416" style="padding-bottom: 2.08955223880597%;"> </div></div> I need to override the padding that is set by "sqs-block" in "site.css". I want it to just affect the spacer elements on my site and not every block if possible. Does this even make sense??
  17. As seen in many FAQ pages, you can read a line of text, then click the text and it will reveal hidden text in a dropdown sort of way. In the footer of my website (Forte template) I have a copyright notice. I'd love to be able to click that line of text and have a more detailed prescript reveal underneath it. Is there a way with Code Injection or a code block, much like making anchor links that this is possible?
  18. Hello, I'm new to the forum, and to injecting custom CSS to SqSp in general. This might be a relatively straightforward issue to resolve - though I'm looking for some guidance. I would like to change the line-block colour, line thickness, and decrease the bottom padding on this elements, across my whole site. Here is a demo of the issue in situ: https://claudius-knig.squarespace.com/config#/pages|/write/(the lines running above each image should be closer to the image, thicker line, and coloured orange) Thanks for any help/guidance :)
  19. Here is an example of what I mean: http://creativetechs.com/tipsblog/small-business/ this website has partial, small green underlines under the title and under the "recent tips" part How would I achieve this through code on my website? Ideally I would like to be able to control the length of the line, weight and the distance it appears from the heading for example Heading 1 will require a thicker, denser line. Heading 2 would require a lighter smaller version of this line to match the text How would I achieve this? Thanks
  20. I’m amazed that no straightforward solution exists to customise the current page active link. In Bedford, using the 'Nav Link (Active)' property changes link colour of the current page and also all other links on mouse hover. A specific property for 'Nav Link (Current Page)' is required. My code doesn’t work, so any ideas you may have will be much appreciated: #headerNav nav .active-link { color: #d14836 !important; } This method works in the Dovetail template, but it has no effect in Bedford: #topNav ul li.active-folder a { color: #d14836 !important; }
  21. Hello, I'm trying to have the text transform to underline in the main navigation (at the top), as well as on hover. Working in Pacific. The text color changes on hover and active currently, but would like to underline as well. Tried to work with the .active-link command, but didn't get far. my site: s2corporation.squarespace.com Any help on this would be awesome!
  22. Hi,I'm using Avenue template and would like to change all bold text to red- i.e the word 'Sold' on this page- https://isabel-dawes-h3qq.squarespace.com/config#/design|/seascapes/#/lyme-regis-1/ It is not a change possible within the standard template, so I tried adding into the Custom CSS but it did not change anything- bold {color:red;} Thanks!
  23. I need to reference an image in a code block. How can I upload a .png or .jpeg and then reference that image in a code block(path to image)?Thank you!
  24. I used custom CSS to force a certain header margin for my logo and I am hoping to find a way for it not to affect the mobile version of the site. Is there anything I can specify so that the mobile version ignores this code? It looks great in browsers, but weird on mobile. #logo { width: 100% !important; padding-top:172px; padding-bottom:169px; padding-right:50px; padding-left:50px; margin: 0;}
  25. I feel like this should be easy, but I cannot figure out how to change the color of my navigation text in the hover state in my Marquee template. It seems to be set at a default of a dark gray (or opacity of black). I’ve been trying to affect the “.main-nav” tag in the custom CSS, but to no avail. Any thoughts? Thank you!
  • Create New...