There’s probably a theme CSS style for the caption that’s doing this. Can you provide a link so I can take a look?
G
Hello again!
Here is the link:
The first two images in the article are the two sides of the picture sleeve for the Byrds’ “Eight Miles High” and “Why.”
The caption is attached to the bottom image and begins, “This is the US picture sleeve for the Byrds’ 1966 hit Eight Miles High / Why.”
The bottom image is noticeably smaller than the top image (both are set at 300px wide.)
Thanks in advance!
N
I don’t know the thinking behind this, but WordPress adds an inline style with a width of 290px when a caption is added to the 300px-wide thumbnail image. I was able to reproduce this on my own test site.
Kindly try the following CSS to FORCE a 300px-wide image display to match the one without a caption.
figure[style="width: 290px"] {
width: 300px !important;
}
G
The code did not work in forcing the image to display at 300px.
The phrase “width: 290px” in the code appeared in red print in the Customizer.
N
Eh, the code should work… and there should be no error in Customizer’s ADDITIONAL CSS box. If the “red print” is like what you see in the screenshot below, then it’s just the editor’s syntax highlighter highlighting different portions of the code. It’s not an indication of an error.
I see you have some custom CSS there already. Please put this new code either at the VERY TOP or VERY BOTTOM… to minimize the chance of introducing any insertion errors.
If there’s any error shown but you’re able to save (PUBLISH) the change, please do so so I can check your site and examine the full CSS code in your Customizer.
If there’s any error shown and you’re unable to save (PUBLISH) the change, please copy and paste all the CSS code in Customizer here (including the new one you just added) so I can examine it to see where the problem may be coming from.
Standing by.
Please ignore my previous response.
The code WORKS on your site. You may not be seeing the change due to browser caching.
You should see it when you check in a different/guest/incognito browser window.
G
I inserted the code into the Customizer at the bottom of the list of my other code. The phrase “width: 290px” appeared in red print but, like before, I was still able to successfully publish the code.
But this time, after publishing the code, I cleared the cache and—Voila!—it worked. Now the image without the caption and the image with the caption are the same size on the published page: 300px wide.
Thank you again for your excellent and determined assistance.
Have a groovy day and keep on keepin’ on …
N