Probleme mit einem Formular

Status
Nicht offen für weitere Antworten.

napsi

Erfahrenes Mitglied
Guten Morgen!

Ich kämpfe gerade mit einem Formular. Ich habe mir zu diesem Zweck aus einem vorigen Beitrag informationen geholt, nur jetzt habe ich das Problem, dass der <label> zwar einen automatischen Zeilenumbruch macht, aber leider das Formularfeld nicht in die richtige Zeile mitrutscht.

Code:
fieldset.form {
         border:0px solid #CCCCCC;
         display:block;
         padding:0em 0em;
         width: 100%;
}

fieldset.form input {
         margin:0 0 5px 0;
         /*background:#EDF7FC;
         border:1px solid #AEDBF0;
         font:bold 13px Verdana, Arial, Helvetica, sans-serif;
         color:#267DAC;*/
         position:relative;
}

fieldset.form input, fieldset.form textarea, fieldset.form select {
         margin-left:200px;
         display:block;
}

label {
         float:left;
         display:block;
         width:150px;
}

HTML:
<form>
<fieldset class="form">

<p><label for="kndnr">Kundennummer (Entspricht auch dem Benutzernamen)</label><input id="aa" type="text" name="kndnr" size="10" maxlength="15" value="">

<label for="mail">e-Mail Adresse (Eingetragene E-Mail Adresse)</label><input id="aa" type="text" name="nn" size="40" maxlength="40" value="">
 
<!-- Der User muss ein Feld ausfüllen und dann auf absenden drücken-->

<p><input type="submit" name="add" value="Absenden"></p>
</fieldset>
</form>

Ich danke im Vorraus

Napsi
 
Hi,

so wie ich das überblicke, ist die Breitenangabe für das label-Element zu gering gewählt, weshalb der darin enthaltende Text in zwei Zeilen ausgegeben wird und somit alle nachfolgenden Formularelemente verschoben werden.
 
Ja, das habe ich bewußt gemacht, da ich sonst mein #div sprenge.

Das <label> darf nicht größer sein.

Es soll nur das Formularfeld mit runter rutschen.

lg.

napsi
 
Dann probier es mal so:

Code:
fieldset.form input, fieldset.form textarea, fieldset.form select {
         margin-left:200px;
         /*display:block;*/ /* auskommentiert = deaktiviert */
}
Code:
<form>
<fieldset class="form">

<p><label for="kndnr">Kundennummer (Entspricht auch dem Benutzernamen)</label><input id="aa" type="text" name="kndnr" size="10" maxlength="15" value=""></p>

<p><label for="mail">e-Mail Adresse (Eingetragene E-Mail Adresse)</label><input id="aa" type="text" name="nn" size="40" maxlength="40" value=""></p>

<!-- Der User muss ein Feld ausfüllen und dann auf absenden drücken-->

<p><input type="submit" name="add" value="Absenden"></p>
</fieldset>
</form>
 
hallo!

Naja, das habe ich schon versucht, was aber im IE für probleme sorgt. Wie soll es anders sein.

der text des 2. Formularfelder rückt bis zum Beginn des oberen Formularfelders herein.

siehe:link

lg.

napsi
 
Ich kann da in dem "Kontakt"-Formular keine Darstellungsfehler bzw. -unterschiede zwischen Firefox und IE6 entdecken.
 
Du hast auch vergessen, in der CSS-Datei style.css meinen Vorschlag zu übernehmen.

Zudem habe ich mit dem Firefox-Browser Probleme, die *.asp-Dateien aufzurufen - stattdessen wird mir der HTML-Quellcode angezeigt.
 
Status
Nicht offen für weitere Antworten.
Zurück