Centering an image in a figure

[wicara]

This is figure 1

and I want to vertically center the image in that figure

Currently, I have the figure 1, 200 px by 200px and the position is set by calculating 50% - 100px which puts it always center but the images are not always 200 px high.

how do I tell the image to be center I tried margin auto but that did not center the image vertically as I had expected

[marc_a]

Hey @wicara,

Thanks for reaching out!

To center that image, you need to set the margin top of your featured image to 0.

In your featured image element CSS, please add this CSS code.

$el {
  	position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    align-items: center;
    display: flex !important;
} 

And it will center the image vertically and horizontally.

Please note that custom CSS code is outside the scope of our support. Issues that might arise from the use of custom CSS code and further enhancements should be directed to a third-party developer or you can avail One where we can answer questions outside of the features of our theme.

Hope that helps.