How exactly would you like to centre them? Horizontally, vertically, or both?
Also, is there any reason why you are using background images for the blog posts, rather than HTML images? I think the simplest approach would be to strip away all of the CSS that sets absolute positioning and BG images, and instead use regular img tags with a max-width: 100% CSS value and then vertically center the images by setting display: flex or display: grid and a fixed min-height on the container div, along with align-items: center.
Unless there is a good reason to use background-images and absolute positioning that I’m not aware of, in which case I will suggest alternative workarounds.
Looking at the HTML mark up, this would be a good use case for CSS subgrid, but unfortunately browser support is still lacking. Subgrid makes it possible to align nested elements that do not share a direct parent, in the same way as if they did in a CSS grid layout. Your images are inside li elements, which follow grid tracks, but the images themselves do not follow these tracks. Unfortunately Edge and Opera do not support subgrid, but at least Chrome does now (and Firefox and Safari have for a while).
Thanks for your reply. I wanted to centre the images horizontally. The setup for the page is done through the Bricks Builder posts element so that must be using background images.
I’ll contact Bricks directly to ask about your points. However, in the meantime, I’ve thought of a workaround by increasing the image size to fill the column width.
