Arkadaşlar merhaba. Toastr eklentisi kullanıyorum. Bildirim tipine göre Font Awesome ikonlarını :before olarak gösteriyorum ancak bu ikonları bildirim içerisinde dikey olarak hizalayamıyorum. Ya :before, toastr-title ve .toastr-content üçü birden dikey ortalanıyor yada hiç biri ortalanmıyor. HTML şablonuve CSS kodları aşağıdadır.
<div class="toast toast-success" aria-live="polite">
<div class="toast-progress" style="width: 100%;"></div>
::before
<div class="toast-title"><h5><b>BAŞLIK</b></h5></div>
<div class="toast-message">Deneme bildirimidir.<br>Deneme bildirim mesajıdır.<br>Deneme bildirimi.<br>Deneme deneme deneme deneme deneme</div>
</div>
#toast-container > .toast { background-image: none !important; max-width: 350px !important; width: calc(100vw - 24px) !important; padding: 15px !important;}
#toast-container > .toast > .toast-title,#toast-container > .toast > .toast-message { margin-left: 5em;}
#toast-container > .toast:before { font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 28px; text-align: center; line-height: 20px; float: left; color: #fff; padding: 15px; border-radius: 50%;}
#toast-container > .toast.toast-warning:before { content: '\f071';}
#toast-container > .toast.toast-error:before { content: '\f00d';}
#toast-container > .toast.toast-info:before { content: '\f05a';}
#toast-container > .toast.toast-success:before { content: '\f00c';} 