images captions align as beginning

Getting to customize an appearance a little I’ve faced with common trouble that the text under images doesn’t center, it always goes to the left side. Additionally, I would like to customize captions text to make it smaller, lighter, and paler.

Brief googling led to www.helpmegeek.com.

As result, I’ve added the following css code in the Appearance -> Customize -> Additional CSS section:

.wp-block-image figcaption {
	margin-top: 0px;
	text-align: center;
	color: #347B98;
	font-size: 90%;
}

The result likes much better:

Nickel-based alloy overlay welding on the boiler tube wall surface.

Damn, I’m good: the caption is smaller, closer to the image, contrast relative main text, and last but not least – centered.

Not to get up twice added a shadow to the pictures: with pale background color it looks more harmonic from my side, using css box-shadow property applied to .wp-block-image img block.

And as the cherry on the pie: found out the site title text is surrounded with white shadow. OK, I’ve thought, I have instructions: right-click, inspect, add h1#site-title a, #header h1#site-title a:hover blocks as in original skeleton-theme styles and… works fine, can play a little with effects, maybe remove them all further…

UPD: a:active doesn’t work though, maybe think about it later.

This entry was posted in CSS, web, WordPress. Bookmark the permalink.