wooty: Anfängerproblem mit <input>-Feldern auf unterschiedlichen Höhen.

Beitrag lesen

Hallo liebe Forumnutzer. Ich bin heute frisch in HTML eingestiegen und habe schon ein Problem wo meine Google-ei mich nichtmehr weiterbringt. Ich habe zunächst versucht ein Login-Modul zu entwerfen, es sollte noch nicht funktionieren aber zumindest die Optik sollte identisch sein. Ich weiß nicht ob das jetzt unbedingt angebracht ist, aber um euch meine Lage erstmal darzulegen hier der Quelltext der "Seite".

<head>
    <title>Erster Versuch</title>

<style type="text/css">
        h1{
            color:#0081BC;
            font:normal small-caps 24pt 80%;
            font-family:impact
           }

#login {
            width:300px;
            height:55px;
            background-image:nachmpool.jpeg;
            color:#000000;
            font:10pt;
            font-family:franklin gothic medium;
            border:2px medium black thin groove;
            padding:2px
                    }

}
   </style>

</head>

<body bgcolor="CCFF99">

<h1 align="center">Herzlich Willkommen auf meiner st&uuml;mperhaften Seite!</h1>
   <div id="login">
    <p>Login:
     <input name="login" type="text" size="20" maxlength="60" >
     <br/> Passwort:<input name="login" type="text" size="20" maxlength="60">
    </p>
   </div>

</body>
</html>

Ich möchte das Eingabefeld unbedingt auf der Höhe mit dem jeweiligen Namen des Feldes haben, aber die Eingabefelder sollen wie mit dem Tabulator eingerückt auf einer Höhe stehen. Habe es bereits mit drei erzwungenen Leerzeichen versucht ; 2 pixel abweichung ca.. Gibt es eine Möglichkeit die beiden auf eine Höhe zu bringen bzw. eine ganz andere (elegantere) Möglichkeit diese Loginfelder zu gestalten?

Mit freundlichen Grüßen,
Wooty