Jump to content

Fix overflowing bounding box on slideshow block

Recommended Posts

I was able to get meta data for my slideshow images - the title and description - to display on mobile devices by using this code (thanks to a fellow forum member for this):

@media screen and (max-width:768px) {
	.sqs-gallery-block-slideshow .meta {
    	display: block !important;
  		overflow: hidden !important;

		/* i added this to keep the text within the contraints of the container */
  		max-width: none !important;
  		height: auto !important;
  		width: auto !important;
 		 min-width: 50%;
  		white-space: normal !important;
	.meta-title {
    	font-size: 20px !Important;
	.meta-description * {
    	font-size: 10px !important;
  	.sqs-gallery-meta-container {
    	display: none;

But I'm running into an issue with the bounding box spilling outside of the image container or the container block. I'm not exactly sure. I would like to contain the text within the image (even expanding the image size). Or cause the text to overflow into ellipsis. I tried using

 text-overflow: ellipsis

to no effect. Maybe I'm using it wrong?



Link to comment
  • Replies 1
  • Views 848
  • Created
  • Last Reply


This topic is now archived and is closed to further replies.

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