[英]Icon not aligning vertically center in html Bootstrap 5
我目前是 Css 的新手,谷歌圖標沒有垂直對齊中心,從底部提供一些填充,您可以在附件中看到...文本居中對齊
.g-icon{
background-image: url("../../assets/imgs/googles.png");
background-repeat: no-repeat;
height: 28px;
width:28px;}
適用於 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>
這是我的屏幕短Output 用於 css 代碼
我給你兩種可能:
在 css 中,您可以使用屬性“float”來粘貼您的文本和您的谷歌圖標。 請參閱: https://developer.mozilla.org/fr/docs/Web/CSS/float
您可以將您的谷歌圖標標簽直接放在與您的文本相同的標簽中。 例如: <p><img src="link/to/google/img">Google text<p>
將 Css 提供給 div..
display:flex;
align-items-center;
justify-content:flex-start;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.