Wrap long text in caption of gallery item!

Boofunking

I am trying to wrap the long text in the captions of gallery items on this SmugMug page http://erbogan.smugmug.com/Graphics/. The code I used on the whole site:

/* change size of font and wrap text on page for captions */
.sm-user-ui .sm-tile-info .sm-tile-title,
.sm-user-ui .sm-tile-content > .sm-tile-info {
font-size: 1.2em;
overflow: visible !important;
white-space:normal !important;
height: auto !important;
}

works on the http://erbogan.smugmug.com/PhotoGalleries page but not on the Graphics page.

I added this to my All Galleries CSS:

.sm-user-ui .sm-tile-content > div.sm-tile-info {
font-size: 1.3em;
background-color: rgba(0,0,0, 0.8);
}

and that works as expected but no mater what code I add I can not get the text to wrap when it is longer than the photo (item) it is associated with.

Any help would be appreciated.

Thank you, Boo

Allen

This will work for that specific page. Remove the .sm-page-node-Nr5pm id you want it elsewhere.

.sm-page-node-Nr5pm .sm-tile-info > .sm-tile-caption {
font-size: 1.0em;
overflow: visible !important;
white-space:normal !important;
height: auto !important;
}

Allen

BTW, I'm been checking this forum off and on all evening and your post just showed up not approved.
So I checked "approve". I have no idea why it did not show earlier.

Boofunking

Allen wrote: »

BTW, I'm been checking this forum off and on all evening and your post just showed up not approved.
So I checked "approve". I have no idea why it did not show earlier.

Thank you!

Boofunking

Allen wrote: »

This will work for that specific page. Remove the .sm-page-node-Nr5pm id you want it elsewhere.

.sm-page-node-Nr5pm .sm-tile-info > .sm-tile-caption {
font-size: 1.0em;
overflow: visible !important;
white-space:normal !important;
height: auto !important;
}

Thank you very much. That solved the problem

ChancyRat

Could I join this thread and ask how I can achieve the same thing?
I added Allen's code to my site-wide CSS, but the gallery titles are not wrapping.
Example folder:

http://www.joinrats.com/EarningTrust

I added this:

.sm-tile-info > .sm-tile-caption {
font-size: 1.0em;
overflow: visible !important;
white-space:normal !important;
height: auto !important;
}

I'm aware that I was given code in the past to achieve the title wrapping, but it never worked.

Thanks.

Allen

ChancyRat wrote: »

Could I join this thread and ask how I can achieve the same thing?
I added Allen's code to my site-wide CSS, but the gallery titles are not wrapping.
Example folder:

http://www.joinrats.com/EarningTrust

I added this:

.sm-tile-info > .sm-tile-caption {
font-size: 1.0em;
overflow: visible !important;
white-space:normal !important;
height: auto !important;
}

I'm aware that I was given code in the past to achieve the title wrapping, but it never worked.

Thanks.

It's very important that the correct type page is mentioned. Page types are homepage,
folder, page and gallery. All might use different class names although the content can look very similar.

.sm-tile-info > .sm-tile-[COLOR=Red]title [/COLOR]{
font-size: 1.0em;
overflow: visible !important;
white-space:normal !important;
height: auto !important;
}