.btnup, .btndown{
display:inline-block;
font-size:20px;
background:#ddd;
border-radius:5px;
cursor:pointer;
width:25px;
line-height:30px;
height:30px;
color:#999;
text-align:center;
margin:0 5px;
}
<link href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" rel="stylesheet"/>
<i class="fas fa-angle-up btnup" id='btnup'></i>
<i class="fas fa-angle-down btndown" id='btndown'></i>
How to place the arrows on center vertically ?