Right-justify caption?

lensjack

Is there a way to both left- and right-justify long photo captions? Thx.

rainforest1155

Hi and welcome to DGrin!
Can you include a link to the gallery where you'd like to make the change so that the customization helpers could take a look?

lensjack

Sure, Sebastian. Thanks for asking. Here's an example where I I'd like to align the ragged right-hand edge:

http://www.lensjack.com/Pages/Game-on-1/

On the "About" page, I tried using a text block because it allows full justification. Problem is, it spreads across the whole page and becomes difficult to read. I'd rather use a left- and right-justified caption there, too.

Allen

This should do it. This will affect whole site.

.sm-tile-info .sm-journal-inlineedit p:nth-child(4) {text-align:justify}

Set the about page to a static width under layout tab.

lensjack

Thanks, Al. Being a complete stranger to html, I do not fully understand.

Where exactly would I enter that code? In a caption? In all captions?

Are you saying that entering it once somewhere will cause all captions site-wide to justify both left and right?

If I can justify captions to eliminate the ragged right edge, I'd prefer to do the same on the About page and ditch the text block. Would there then be any reason to set that page to a static width?

Allen

On any page go into customize > Content and Design
Highlight "entire site" at the top of right flyout
Just below that Click "Content" tab
Does "On Entire Site" heading show?
If so, does CSS block show above "ADD CONTENT BLOCKS" heading?
Click wrench on it and add below CSS into block and save.

If not, scroll to the bottom of "ADD CONTENT BLOCKS" heading
Click "HTML & CSS" to expand
Drag a CSS block out to page, then click its wrench and add below CSS into block and save.

With "entire site" highlighted you now have a CSS block/widget

/* justify text on all journal style galleries */
.sm-tile-info .sm-journal-inlineedit p:nth-child(4) {text-align:justify}
 /* about page */
.sm-page-node-mN62K .sm-widget-text {text-align:justify}

lensjack

Al, many thanks for taking time to walk me through it step by step. This is perfect. One question. It works as intended everywhere but on the About page. If I go into Content and Design for just that page, it shows your CSS block, but it is not right-justifying. I'm likely missing something obvious, but cannot find it. I am entering the caption text same way as on the other pages -- by copying it from a Word doc. I've tried changing the justification parameters on the Word doc, thinking they may be interfering with the CSS block, but it has made no difference. Any thoughts?

Allen

lensjack wrote: »

Al, many thanks for taking time to walk me through it step by step. This is perfect. One question. It works as intended everywhere but on the About page. If I go into Content and Design for just that page, it shows your CSS block, but it is not right-justifying. I'm likely missing something obvious, but cannot find it. I am entering the caption text same way as on the other pages -- by copying it from a Word doc. I've tried changing the justification parameters on the Word doc, thinking they may be interfering with the CSS block, but it has made no difference. Any thoughts?

Because on that gallery it's the third child.

/* justify text on all journal style galleries */
.sm-tile-info .sm-journal-inlineedit p:nth-child(3), /* about page */
.sm-tile-info .sm-journal-inlineedit p:nth-child(4) {text-align:justify}
[strike] /* about page */
.sm-page-node-mN62K .sm-widget-text {text-align:justify}[/strike]

lensjack

Allen wrote: »

Because on that gallery it's the third child.

/* justify text on all journal style galleries */
.sm-tile-info .sm-journal-inlineedit p:nth-child(3), /* about page */
.sm-tile-info .sm-journal-inlineedit p:nth-child(4) {text-align:justify}
[strike] /* about page */
.sm-page-node-mN62K .sm-widget-text {text-align:justify}[/strike]

Hey, I knew that. :-) Not.

Thanks again, Al. Much appreciated.