Jump to content

7.1 Gallery Image Text Overlay

Recommended Posts

  • 4 weeks later...

So, I went a completely different route and tried to use "image" blocks with "display caption on hover" and CSS to achieve the same effect. As the basis, I used my "Dark Bold" page color setting and then developed the following for my CSS:

//IMAGES NO BORDER//
.dark-bold.page-section {padding: 0 !important; width: 100% !important; overflow: hidden !important}

.dark-bold.page-section > .content-wrapper {display: contents !important}

.dark-bold.page-section .sqs-block-image {margin: 0 !important; padding: 0 !important; border: 0px !important}

//END IMAGES NO BORDER//

Below (and, attached) was the end result.

1394594396_ScreenShot2020-05-18at10_09_46AM.thumb.png.3d0693b04f8d556396414a387bf37584.png

Maybe this will help you in what you're trying to achieve!

 

Edited by kd_simmons
After some trimming to see what was essential, I was able to shorten the CSS code.
Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.