Jump to content

rpzn6171

Member
  • Posts

    8
  • Joined

  • Last visited

rpzn6171's Achievements

Level 2

Level 2 (2/20)

0

Reputation

  1. I have been trying to modify my header and have been successful at removing the underline, bolding and changing the color on the active page but no matter what I do, I can't seem to remove the underline and bold the active page within the drop down. If I add any other code, it negates the code I've written. Any ideas what to do? The website is: https://www.thesqinstitute.com/ .header-nav a:hover {color: #D99B65!important;} .header-nav-item--active a{background-image:none!important; font-weight:bold; color:#D99B65!important; } .header-nav-folder-item a{ color: black !important; } .header-nav-folder-content { left: 0 !important;text-align:left!important;background-color: #D3D3D3!important; } Thanks in advance!
  2. I have been looking for a way to allow the hover effect to still work when it hovers over the text and not just the image. The Site URL is this: https://www.thesqinstitute.com/interactive-labs Here is the code I'm using on the page. <style> .sqs-block-image .design-layout-fluid .fluid-image-container .content-fill img { transition : 0.4s; } .sqs-block-image:hover .design-layout-fluid .fluid-image-container .content-fill img { opacity : 0.5; transform : scale( 1.1 ); } </style>
  3. @creedon That worked! Thank you so much! Just curious, do you know of a simple code that would allow the hover effect to remain even as the mouse hovers over the text?
  4. Hi @creedon , so I added the code and it didn't do anything for the expanding of the images but it did make the color blue (which I then changed to black). Any other thoughts why this might be? <style>.fluid-image-container.sqs-image-content:hover{transform: scale(1.1); transition: .4s;} img{transform: scale(1); transition: .4s;} .fluid-image-container.sqs-image-content{overflow:hidden!important;} .fluid-image-container.sqs-image-content:hover{background:black!important;opacity:0.5; transition: .4s} .fluid-image-container.sqs-image-content {opacity:1; transition: .4s} a { text-decoration: none !important; }</style> <style> .sqs-block-image .design-layout-fluid .fluid-image-container .content-fill img { transition : 0.4s; } .sqs-block-image:hover .design-layout-fluid .fluid-image-container .content-fill img { opacity : 0.5; transform : scale( 1.1 ); } </style> Thanks for your help!
  5. @creedon Yeah I'm not sure why it isn't showing up. Here it is: https://www.thesqinstitute.com/interactive-labs
  6. I added some code to the page I shared in the site URL and when the site is in editing mode it works perfectly but once I published the page, the images began to expand beyond the block even though it should be hidden. Any help would be greatly appreciated. Here is the code: <style>.fluid-image-container.sqs-image-content:hover{transform: scale(1.1); transition: .4s;} img{transform: scale(1); transition: .4s;} .fluid-image-container.sqs-image-content{overflow:hidden!important;} .fluid-image-container.sqs-image-content:hover{background:blue!important;opacity:0.5; transition: .4s} .fluid-image-container.sqs-image-content {opacity:1; transition: .4s} a { text-decoration: none !important; }</style>
×
×
  • 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.