It’s time for graphics and our theme had no option to set the caption text size to differentiate it from the main text in our posts. So we did a Google search for “image caption text size” and found different CSS code snippets. These were applied as “Additional CSS” in the Appearance > Customise window. We tried several variants, none of which worked.
| Attempt 1 | Attempt 2 | Attempt 3 |
| .wp-caption-text { font-size: 8px; } | div.figure { font-style: italic; font-size: smaller; text-indent: 0; } | .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } |
Fortunately, we checked the HTML for clues to narrow the keyword search. While WordPress inserts the figures as “Image” blocks (in Gutenberg), the HTML calls them “Figure”. Within, we noted <figcaption>…</figcaption> tags. BingoThe ever reliable Stack Overflow.
#content figcaption {
border: 1px solid blue;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
text-shadow: none;
color: black;
text-align: center;
height: auto;
word-wrap: break-word;
width:300px;There were more configuration options than we required – handy to know.
As of this post: WordPress 5.4.2