我不明白为什么当我向该元素添加边框时,该元素不在边框中心
我的CSS:
.arrow
{
font-size: 25px;
color: #f9f9f9;
position: absolute;
top: 50%;
transform: translateY(-50%);
border-radius: 50%;
border: 1px solid #f9f9f9;
height: 50px;
width: 50px;
text-align: center;
margin: 0 auto;
}
我的html:
<span id="slide_left" class="arrow"><i class="fas fa-chevron-left"></i></span>
我只想将元素放在此边框的中心!
如果有人知道为什么? :)
答案 0 :(得分:0)
尝试以下CSS代码:
.arrow{
display: block;
height: 50px;
width: 50px;
line-height: 50px;
border-radius: 50%;
border: 1px solid #000;
text-align: center;
font-size: 25px;
}
答案 1 :(得分:-1)
您的CSS中发生了太多事情。从简单开始。
.arrow{
font-size: 25px;
padding: 5px;
border: 1px solid black;
border-radius:50%;
}