Caption text css

[nmarsh]

Hi there

I’m trying to create menu pages on our site, with a picture ‘button’ and a caption underneath giving details of the linked page name.

This seems to work as long as the caption is not too long – if the text goes to two lines then the buttons on the row below go out of sync.

I’ve tried amending the css for the caption text to try and increase the padding but this doesn’t seem to work for me. Any ideas how I can tweak this to keep all the buttons in line?

Thanks!

.wp-caption {
max-width: 100%; /* Keep wide captions from overflowing their container. */
padding: 5px;
}
.wp-caption .wp-caption-text,
.gallery-caption,
.entry-caption {
font-style: italic;
font-size: 14px;
font-size: 0.875rem;
text-align: center;
line-height: 1.5;
color: #757575;
}

[Zex]

Hello,nmarsh!

Try to add an “!important” attribute to your padding value:

.wp-caption {
max-width: 100%; /* Keep wide captions from overflowing their container. */
padding: 5px!important;
}

or try to limit the height of the wp-caption:

.wp-caption {
max-width: 100%; /* Keep wide captions from overflowing their container. */
height:200px!important;
}

Regards

[nmarsh]

Perfect, that did the trick! I’m learning a lot this week 🙂

[Author]

Posts