Gallery Title caption not wrapping

Site URL: https://kindea-labs.squarespace.com/

Hi!

We're utilizing a gallery block to showcase video links to Vimeo. We're having a hard time formatting the titles in the caption. The text is not wrapping but cutting off the word with 3 dots at the end. Ideally, the words would wrap and the whole thing would be centered.

.image-slide-title {

  word-wrap: break-word;
  padding-bottom: 10px;
  font-weight: bold;
  
}

Also, how can I make the font responsive? I've tried adding the line below which mostly works but on mobile the font is super small.

.image-slide-title {
  
  font-size:1.2vw !important;
  word-wrap: break-word;
  padding-bottom: 10px;
  font-weight: bold;
  
}

Thank you!

I see fine here. Do you still need help on this?

Hi Tuanphan, please see in mobile aspect ratio, and my second question.

Thank you!

On 9/9/2020 at 11:14 AM, tuanphan said:

I see fine here. Do you still need help on this?

Still available to help on this?

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
.image-slide-title {
    text-overflow: unset !important;
    overflow: visible !important;
    white-space: initial !important;
	font-size: 12px !important;
}
}

@Tiger_Thomas and @tuanphan What was the final CSS you used for wrapping the text? Trying to get Gallery Image Titles and Descriptions to wrap on https://www.sbamatch.com/home-copy

Thank you!

15 hours ago, LUDLOW said:

@Tiger_Thomas and @tuanphan What was the final CSS you used for wrapping the text? Trying to get Gallery Image Titles and Descriptions to wrap on https://www.sbamatch.com/home-copy

Thank you!

Add this CSS

.image-slide-title {
    white-space: initial !important;
}

Bingo! Thank you very much.