Can't align icon with text

Question

Hello, I'm currently having some trouble aligning my icons horizontally with my text. Span doesn't seem to be helping me here, any suggestions?

https://code.sololearn.com/WA109a14A21A/

Answer 1

Remove that span, an inline(span) element can't contain a block(like div) element. Replace it with div and apply following styles

.error>div{
background-color:blue;
display:flex;

}
.error>div>i{
margin:3px 10px;
}