Jump to content

Adjusting width of slideshow caption background color

Recommended Posts

Site URL: https://vanilla-bat-2gpn.squarespace.com/


I desperately need to adjust the width of this gallery caption background so it matches the width displayed on mobile (now it takes op too much space on the web version) while staying centered on the slideshow. I'm pretty new to CSS and this is the code I'm currently working with (which is probably a mess) and somehow managed to get a result thats pretty close to what I wanted:

.gallery-caption {
 position: static;

.gallery-caption p{
text-align: center;
color: black;
font-size: 2rem !important;
font-family: Aesthet Nova !important;

.gallery-caption-content {
position: absolute;
background-color: white;
left: 22%;
top: 45%;
right: 22%;
bottom: 45%;
display: flex;
justify-content: center;
align-items: center;
z-index: 999;
padding: 2%;
  transition: opacity ease 200ms !important;
  opacity: 1 !important;
  pointer-events: none;
  color: #fff;

Can you help? Fingers crossed, thanks!

/ Michella

Skærmbillede 2021-02-07 kl. 17.19.37.png

Skærmbillede 2021-02-07 kl. 17.19.18.png

Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

On 2/10/2021 at 8:06 PM, michellalaura said:

I sent you an email now. I just desperately want the issue resolved because it is the only thing keeping me from publishing my website.

Your site is expired. You can contact Squarespace Customer Care to extend it (free)

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.