Trying to vertically align multiple font awesome icons:
#############################
icon icon icon icon icon icon
#############################
<div class="announcement-card-body modal-body card border-0">
<span class="info fa fa-info-circle"></span>
<span class="star fas fa-star fa-lg "></span>
</div>
Attempted using vertical-align: middle without success.
Here are some other attempts based on feedback:
.info{
display: flex;
align-items: center;
justify-content: center;
}
.star {
display: flex;
align-items: center;
justify-content: center;
}
Also tried:
.info{
display: flex;
flex-direction: row;;
}
.star {
display: flex;
flex-direction: row;
}