垂直对齐FontAwesome图标以与<a href>
标记中的文本垂直对齐的最佳方法是什么?
这是到目前为止的HTML和CSS。
谢谢。
.btn-tertiary{
display: block;
width: 100%;
padding: 10px 7px 10px 10px;
border: 2px #E0DDDD solid;
margin-bottom: 10px;
font-size: 15px;
color: #0D0155;
height: auto;
font-weight: 600;
letter-spacing: 1px;
-webkit-transition:all 300ms ease-in-out;
transition: color 0.3s ease 0s;
}
.btn-tertiary:hover{
background-color: #004;
color: white;
text-decoration: none;
border: solid 2px #004;
}
.btn-tertiary i{
color: #E0DDDD!important;
float: right!important;
font-size:20px;
height: 20px;
vertical-align: middle;
}
<a class="btn-tertiary" title="Login to mange your investmnts & more" href="#">Login to my account<i class="fa fa-chevron-circle-right" aria-hidden="true"></i></a>
最佳答案
为您的i元素使用填充。或者将元素位置设为相对,而我将位置设为绝对。然后使用顶部或底部。
关于html - 在A-tag中将 Font Awesome 图标与文本垂直对齐,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42040668/