<div class="spe-col1">
<a class="spe-links" href="tel:+905333913306" rel="canonical" title="Telefon"><i class="fa fa-phone" aria-hidden="true"></i> Telefon: 0533 391 33 06</a>
</div>
<div class="spe-col2">
<a class="spe-links" href="https://api.whatsapp.com/send?phone=+905333913306&text=Merhaba" rel="canonical" title="Whatsapp'tan yaz"><i class="fa fa-whatsapp" aria-hidden="true"></i> Whatsapp: 0533 391 33 06</a>
</div>
<div class="spe-cle"></div>
css kodları
.spe-links {
color:#fff;
display:inline-block;
font-weight:600; /* yazı tipine bağlı kalınlık kazandırır font-weight: bold; olarak da kullanabilirsin */
}
.spe-col1 {
float:left;
}
.spe-col2 {
float:right;
}
.spe-cle {
clear:both;
}Yukarıda verdiğim whatsapp linki mobil cihazdan tıklandığında doğrudan uygulamayı açar. Telefona tıklandığında ise arama ekranı çıkar.
i class diye bir şey yoktur. i aslında italik yazım için kullanılan bir koddur. Fontawesome <i> tagını icon eklemek için kullandığı için hazır fontawesome kodunu kullanıyorsun sen de. Aynı mantıkla sen de bir icon oluşturabilirsin. Bunun için illa i kullanmana gerek yok, span veya div'de kullanabilirsin.