The image in the div is supposed to be at the center but is aligned to the right of the parent div element. How can I bring to the middle?

The image in the div is supposed to be at the center but is aligned to the right of the parent div element. How can I bring to the middle?
0

#1

https://codepen.io/forestfire/pen/XzZRaX?editors=1100


#2

position: absolute; on the image container/parent is the culprit here, remove that, you do not it.


#3

I’ve actually used margins to sort the issue. I needed to use position:absolute because I wanted to place it at the bottom,that’s why.