HTML Fehler - Startseite - A-Tag fallsch gesetzt ?

[Einrad-Shop]

Semantic Fehler, falsche A-Tag setzung?

<a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="fa fa-user"></span><spanclass="hidden-xs hidden-sm"> Anmelden </span><span class="caret"></span></a>

Sollte das nicht so aussehen?

<span class="fa fa-user"></span><spanclass="hidden-xs hidden-sm"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Anmelden</a></span><span class="caret"></span>

 

[Einrad-Shop]

AW: HTML Fehler - Startseite - A-Tag fallsch gesetzt ?

Eine zweite Frage ist auch, was ein leerer span bringt, ist der nicht überflüssig?

<span class="fa fa-user"></span>

 

[Einrad-Shop]

AW: HTML Fehler - Startseite - A-Tag fallsch gesetzt ?

Zeile 23 so geändert

<span class="fa fa-user"></span><span class="hidden-xs hidden-sm"><a href="#" class="dropdown-toggle" data-toggle="dropdown">{lang key="login" section="global"}</a></span>
            <span class="caret"></span>

Und schon ist das Layout zerhaun 🙁

 

[ag-websolutions.de]

AW: HTML Fehler - Startseite - A-Tag fallsch gesetzt ?

zu 2)

Die FontAwesome-Zeichen (hier "fa-user" werden in inhaltsleere Tags gesetzt
https://fortawesome.github.io/Font-Awesome/examples/

auch bei 1 kann ich keinen Fehler sehen (im Original)