How to center an image vertically and horizontally inside a div?

Display table:

1. Display table-cell CSS features on modern websites, especially sites that have a one-page category layout. Let the element behave like a td tag.
2.vertical-align:middle; Align the box of an inline element vertically inside the line box containing it.
3. text-align:center;
Text-aligned properties specify horizontal alignment.

<div class="holder">
<img src="https://upokary.com/wp-content/uploads/2021/08/dove.jpeg">
</div>

    

CSS:

.holder{
    width: 500px;
    height: 400px;
    border: 5px solid red;
    display:table-cell;
    vertical-align:middle;
    text-align:center;
}
img{
    width: 150px;
    height: 150px;
    
}
  
   

RESULT: