Jump to content

How do I get caption text below an image to be over the image in gallery:slideshow simple?

Go to solution Solved by creedon,

Recommended Posts

Site URL: https://kistcreekcattle.squarespace.com


I am trying to write css to put the slideshow caption over a slide image. I have been able to access the slide item in the slideshow and color the background of the caption text but I don't know how to put the caption text over the slideshow image. Can you help? Here is my css code: 


{background-color:rgba(0, 0, 0, 0.2)}

Attached is a image of what I am trying to achieve. The sitewide password to my site is :#Cattle. The slideshow I am playing with is the first slideshow under Horses For Sale. The second slideshow is what I am trying to do using an inline image that has this functionality in squarespace 7.1.

Thanks so much,



Link to comment
  • Solution

Replace your .gallery-caption-slideshow ruleset with the following.

.gallery-caption-slideshow {

  background-color : rgba( 0, 0, 0, 0.8 );
  height : auto;
  margin-top : 0;
  padding : 0.5em;
  position : absolute;
  top : 50%;
  transform : translateY( -50% );

This is for v7.1 and specific to the posters need.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

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.