Don't working vertical alignment of img in div css

Question

In my web site I have blocks that describe site features. In this block there are div element which contains img, and I want to align the image vertically in middle of the div, but my code don't working. My html code -

<div class="col-3 feature_block">
    <div><img src="{{ URL::asset('pic/services1.svg') }}"/></div>
    <h4>Işiň awtomatizasiýasy</h4>
    <p>Awtomatlaşdyrylan proses ullanyjynyň ulgama giren badyna başlaýar.</p>
</div>

My css code -

.feature_block div{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin: 25px 0 25px 0;
    background-color: white;
    text-align: center;
    line-height: 80px;
    vertical-align: middle;
}

What happens in browser - screenshot of browser

Please help, thank you

Answer 1

Your class name is col-3. So your CSS should be like this :

 .col-3 div {
   ....
  }

Answer 2

This works

.feature_block div{
display:flex;
justify-content:center;
align-items:center;
}