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';}