Padding for caption on hover

Site URL: https://tomato-hibiscus-5kcf.squarespace.com/fleet-finch

Hello!

I have used some code to create a caption on hover in a simple grid gallery. It works fine, but the I would like to increase the padding around the text. https://tomato-hibiscus-5kcf.squarespace.com/fleet-finch  password: Magnolia.

Here is the code I used:

/* Image Captions on Hover*/
.layout-caption-overlay-hover .image-caption-wrapper {
  min-height: 100%;
  display: flex;
  align-items: center; /*vertically centered */
  justify-content: center; /*text align center*/
  background: rgba(255, 108, 0, .8) !important; /* Background Overlay*/
}

.layout-caption-overlay-hover .image-caption-wrapper p1 {
  color: White !important; /* font color of caption */
}

14 hours ago, momallo said:

Site URL: https://tomato-hibiscus-5kcf.squarespace.com/fleet-finch

Hello!

I have used some code to create a caption on hover in a simple grid gallery. It works fine, but the I would like to increase the padding around the text. https://tomato-hibiscus-5kcf.squarespace.com/fleet-finch  password: Magnolia.

Here is the code I used:

/* Image Captions on Hover*/
.layout-caption-overlay-hover .image-caption-wrapper {
  min-height: 100%;
  display: flex;
  align-items: center; /*vertically centered */
  justify-content: center; /*text align center*/
  background: rgba(255, 108, 0, .8) !important; /* Background Overlay*/
}

.layout-caption-overlay-hover .image-caption-wrapper p1 {
  color: White !important; /* font color of caption */
}

maybe try

.gallery-caption-wrapper {
    padding: 15px 15px;
    box-sizing: border-box;
}