Answers for "css how to align images horizontally"

centre align image in div

body {
  margin: 0;
}

#over img {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

css center image in div

<div style="width: 300px; height: 300px;">
  <img src="./image.png" class="center">
</div>

.center{
  object-fit: scale-down;
  max-width: 100%;
  max-height: 100%;
  height: 15em; /*set your constraint to height/width and set the other to auto*/
  width: auto; 
}