html gui + buttons

[win2k]

Hi zusammen,
kennt einer von euch einen guten GUI Ersteller für html / css Seiten?

Weiß jemand wieso das fieldset sich nicht automatisch anpasst und wieso das Formular nicht funktioniert?

    <form action="lauswertung.php" method="post">
    <fieldset>
        <legend><b>Anmeldung</legend>
        <table>
            <tr>
                <td><label for="benutzername">Benutzername:</label></td>
                <td><input type="text" id="benutzername" name= "benutzername"><td>
            </tr>    
            <tr>    
                <td><label for="passwort">Passwort:</label></td>
                <td><input type="password" id="passwort" name= "passwort"><td>
            </tr>
        </table>
        <table>
            <tr>
                <input type="button" name="submit" value="Anmelden">    
                <input type="button" name="reset" value="Abbrechen">
                <input type="button" name="submit" value="Hilfe">    
            </tr>    
        </table>
    </fieldset>
    </form>

 

[Gilles]

Du missbrauchst hier eine Tabelle kann ich dir auf dem ersten Blick sagen ;)
Und dann nutzt du sie leider auch noch falsch.
In einen Table-Row (tr) darf nur Tablediv(td) stehen. Bei dir sind da inputs. Desweiteren benutzt du den depracted big tag (b) und schliesst diesen niemals
Schonmal gut, dass du Label benutzt, aber du musst da zwingend die Tabelle los werden, denn hier sind keine tabellarischen Daten :)

 

[win2k]

ahhh okay hab alle tr tds entfernt.
Nun meine frage wie bekomm ich das jetzt alles schön sauber untereinander?
mit table war das ja recht easy.

 

[Gilles]

ahhh okay hab alle tr tds entfernt.
Nun meine frage wie bekomm ich das jetzt alles schön sauber untereinander?
mit table war das ja recht easy.

Mit CSS. Damit wir dir helfen können wäre der aktuelle Code oder ein Link zur Seite nötig :) Wenn du den Code postest, vielelicht kannst du diesmal anstatt den CODE- den HTML-Tag benutzen :)

Wie du in fast jeden 2. Thread lesen kannst: Das Aussehen macht man nicht mit HTML sondenr mit CSS. Wenn du dich fragst: "Wie schaffe ich, dass es so aussieht?" Ist es immer CSS :)

 

[Gilles]

Ich mach das mal eben für dich ;)

aus folgendem Quelltext

<form action="lauswertung.php" method="post">
  <fieldset>
    <legend>
      <b>
      Anmeldung
    </legend>
    <label for="benutzername">
      Benutzername:
    </label>
    <input type="text" id="benutzername" name= "benutzername">
    </br>
    <label for="passwort">
      Passwort:
    </label>
    <input type="password" id="passwort" name= "passwort">
    </br>
    </br>
    <input type="button" name="submit" value="Anmelden"><input type="button" name="reset" value="Abbrechen"><input type="button" name="submit" value="Hilfe">
  </fieldset>
</form>

solltets du folgenden machen

<form id="loginForm" action="lauswertung.php" method="post">
  <fieldset>
    <legend>
      Anmeldung
    </legend>
    <div class="formularfeld">
      <label for="benutzername">
        Benutzername:
      </label>
      <input type="text" id="benutzername" name= "benutzername">
    </div>
    <div class="formularfeld">
      <label for="passwort">
        Passwort:
      </label>
      <input type="password" id="passwort" name= "passwort">
    </div>
    <input type="button" name="submit" value="Anmelden"><input type="button" name="reset" value="Abbrechen"><input type="button" name="submit" value="Hilfe">
  </fieldset>
</form>

Alsoo. Jetzt erkläre ich das mal und du probierst das zu verstehen damit es beim nächsten mal richtig ist :)
das b Tag ist nur für das Aussehen zuständig und hat nichts mit dem Inhalt zu tun. Deswegen sollte man es auch nicht benutzen. Dafür benutzt man CSS.
Breaks (br) solltets du nur nutzen um einen Zeilenumbruch zu erzwingen (Bei Gedichten, Briefen usw)
Da Label und input immer ein formularfeld bilden, hab ich diese zusammen gepackt (div).
Was "xonchanage" für ein Attribut sein soll weiß ich nicht ;) Hab es in onchange umgeschrieben.

hier noch das passende CSS dafür. Wenn du in zukunft planst dir eine Website zuerrichten, dann probiere HTML und das Design auseinander zu halten :)
Und fange an CSS zu lernen ;)

#loginForm fieldset {
              width: 18em;
          }
            
            #loginForm label {
                display: inline-block;
                width: 6em;
            }
            
            #loginForm input {
                margin-right: 0.4em;
            }

Edit:
Auf Grund des Authors Quelltext abgeändert :)

Hab deinen orginalen Code so umgeschrieben, dass er auf keine Seite von dir verweist, sondern habe mir ein Beispiel an deinem gepostetetn Code genommen