I am currently new to Css google icon is not getting align center vertticaly giving some padding from bottom you can see in attached file...text is aligned center
.g-icon{
background-image: url("../../assets/imgs/googles.png");
background-repeat: no-repeat;
height: 28px;
width:28px;}
for html
<div class="text-center pl-3 pt-3 pb-3 shadow bg-white rounded reg-head">
<i class="g-icon d-flex align-items-center"></i>
<div class="reg">
<label class=" mx-0 my-0"> Register with Google</label>
</div>
</div>
Here is my screen short Output for css code
Provide Css to the div..
display:flex;
align-items-center;
justify-content:flex-start;
I offer you two possibilities:
In css you can use the property "float" to stick your text and your google icon. See: https://developer.mozilla.org/fr/docs/Web/CSS/float
You can place your google icon tag directly in the same tag as your text. For exemple:<p><img src="link/to/google/img">Google text<p>