我在将图标(垂直和水平)居中于父级 div
上遇到了问题。我的页面上有许多不同大小的父级 divs
,因此我希望能够将图标按比例放置在每个父级 div
的中心位置。以下是问题的 JSFiddle:
HTML 代码:
<div class="img_container">
<i class="icon-play-circle"></i>
</div>
<br>
<div class="img_container2">
<i class="icon-play-circle"></i>
</div>
CSS
.img_container{
width:100px;
height:100px;
position:relative;
background:red;
}
.img_container2{
width:100px;
height:50px;
position:relative;
background:blue;
}
.icon-play-circle{
position:absolute;
top:45%;
left:45%;
color: white;
}