2 Eingänge mit gleichen Klassen haben unterschiedliche Erscheinungen (HTML)

Question

Ich habe ein Formular mit zwei Eingängen mit den gleichen Klassen gemacht, aber sie haben unterschiedliche Erscheinungen. Sie erhalten nur das gleiche Aussehen, wenn ich den Typ von "E-Mail" zu "Text" ändere. Ist es ein Problem mit dem Code oder ist das HTML5?

<form action="../../../redirect.html"> 
 
<input name="username" id="login-username" class="login-input pure-u-1" type="email" maxlength="96" tabindex="1" aria-required="true" value="" placeholder="Indtast din e-mail" title="Indtast din e-mail" autocorrect="off" spellcheck="false" required autofocus> 
 

 
<input name="password" id="login-password" class="login-input pure-u-1" type="password" maxlength="96" tabindex="1" aria-required="true" value="" placeholder="Indtast din adgangskode" title="Indtast din adgangskode" autocorrect="off" spellcheck="false" required> 
 
<button type="submit" formaction="../../../redirect.html" id="login-signing" class="pure-u-1 pure-button mbr-button-primary" value="Submit" tabindex="1">Login</button> 
 
</form>

Answer 1

in Ihrem css file, scheint es, dass es Stil Eingang, der Klasse "pure-Form" hat, aber Sie verwendet haben "Login-Eingang". Es scheint also, dass das Problem darin besteht, wie man seinen CSS-Stil nicht über "HTML5" verwendet.

ist dies der richtige Code:

<form action="../../../redirect.html"> 
<input name="username" id="login-username" class="pure-form pure-u-1" type="email" maxlength="96" tabindex="1" aria-required="true" value="" placeholder="Indtast din e-mail" title="Indtast din e-mail" autocorrect="off" spellcheck="false" required autofocus> 

<input name="password" id="login-password" class="pure-form pure-u-1" type="password" maxlength="96" tabindex="1" aria-required="true" value="" placeholder="Indtast din adgangskode" title="Indtast din adgangskode" autocorrect="off" spellcheck="false" required> 
<button type="submit" formaction="../../../redirect.html" id="login-signing" class="pure-u-1 pure-button mbr-button-primary" value="Submit" tabindex="1">Login</button> 
</form>