Widen Image Title in Lightbox

W.W. Webster

I implemented the following CSS to widen both the titles and captions of images displayed in the Lightbox view:

/* Make the width of the lightbox caption and title wider */
.sm-user-ui .sm-lightbox-caption,
.sm-user-ui .sm-lightbox-title {
  max-width: 1000px !important;
}

I also widened the relevant panel to 1010px accordingly.

However, while the caption is lengthened, I've just noticed that title line is still wrapping short of the 1000px limit.

Do I have a syntax error in my code, or could there be another problem somewhere?

Hikin' Mike

Maybe I'm not looking at the right photo. Do you have a link where the title/caption is "wrong"?

W.W. Webster

http://smu.gs/1n3m1eP

Hikin' Mike

Try this:

/* Removes the 240px margin-right */
.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info {
    margin-right: 0 !important;
    }
/* Widen the Lightbox Title/Captions Box */ 
.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info > div, 
.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info > p {
    max-width: 1000px !important;
    }

W.W. Webster

Thanks, but it doesn't appear to have fixed the title problem!

Hikin' Mike

Try adding this in red to the code I posted above:

/* Removes the 240px margin-right */
.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info {
    margin-right: 0 !important;
    }
/* Widen the Lightbox Title/Captions Box */ 
[COLOR=Red][B].sm-lightbox-basic .yui3-widget-ft .sm-lightbox-title, 
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption, 
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-keywords,[/B][/COLOR]
.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info > div, 
.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info > p {
    max-width: 1000px !important;
    }

pilotdave

W.W. Webster wrote: »

Thanks, but it doesn't appear to have fixed the title problem!

How about this?

.sm-lightbox-basic .sm-lightbox-ft-center .sm-lightbox-info > p {
max-width: 100%!important;
}

Dave

W.W. Webster

Hikin' Mike wrote: »

Try adding this in red to the code I posted above ...

Eureka! Thanks!

W.W. Webster

pilotdave wrote: »

How about this?

Thanks, Dave. Your suggestion looks very elegant, but Mike has provided a fix above and if it ain't broke ...

I appreciate your response,