layout problem mit form-action

[Rocco]

hier gibts ein beispiel für mein problem.

http://www.lottermoser.at/test/searchtest3.htm

eigentlich dürfte das feld nur eine zeile breit sein, leider gibts aber unter dem eingabefeld noch eine zeile, wo kommt die her und wie krieg ich die weg?
kann mir da wer helfen?

 

[Verhueterli]

Ehrlich gesagt verstehe ich dein Problem nicht ganz bzw. glaube ich, dass alles korrekt dargestellt wird.

Ich sehe da einen Rahmen (der von <table> erzeugt wird), ein Eingabefeld und ein Submit-Button, so soll es doch auch sein, oder?

 

[Rocco]

ja schon, aber das problem ist der abstand zwischen dem eingabefeld und dem unteren rand der tabelle.
da dürfte eigentlich kein abstand sein, der grüne rahmen sollte das ganze eng umschliessen.
leider sind da aber noch ca. 20px abstand bis zum unteren rand.

 

[Verhueterli]

Das liegt daran, dass der HTML-Tag <form> nach der Beendigung automatisch einen solchen Abstand darstellt - ähnlich wie bei den Tags <h1>, <h2> usw.

Eine Lösung wäre, dass Formular (<form>) um die Tabelle zu machen und nicht die Tabelle um das Formular.

 

[Rocco]

dann wäre aber der abstand aber unter der tabelle und da brauch ich auch keinen.
bei diesem beispiel würds natürlich so gehen wie du gesagt hast, aber auf der homepage, wo ich das benötige gibts die möglichkeit nicht, da sonst auf jeden fall das layout gesprengt wird.

gibts da keine möglichkeit das ganz zu unterbinden?

 

[hobbyuser]

Hi Rocco

wenn ich mir den Quelltext der oben verlinkten Seite anschaue, denke ich eher das liegt an dem Absatz den du da reingebaut hast.

<td width="510">
  <form action="scripts/search7.pl" method="post">
    <input type="text" name="terms" size="30" maxlength="100" tabindex="1" />
    <input name="SUBMIT" type="submit" value="Suchen!" tabindex="3" />
  </form>
  <p align="center"><span class="fliesstext"></span></p>
</td>

Lösche diesen Absatz raus dann sollte es passen und wenn nicht mach es mit CSS ( form { margin:0; padding:0; }), das passt immer.

Gruß
Hobbyuser

 

[Rocco]

ja super, der tipp mit der css war der goldrichtige, danke :-))
eine frage noch, wie müsste die syntax aussehen wenn ich statt dem standardbutton-submit eine grafik einbinden möchte?

 

[hobbyuser]

Auch hier hilft wieder ein Blick in die Referenz. :-D
LINK: http://de.selfhtml.org/html/formulare/klickbuttons.htm#modern

Immer getreu dem Motto: Man muss nicht alles wissen, solange man weiß wo es steht. :lol:

 

[L.T.M]

Hallo,

eigentlich wollte ich ja nicht länger hier verbleiben, aber für folgende Frage muss ich das wohl :-D

ich hab ein ähnliches Problem mit diesem Code:

<form action="index.php?section=login" style="margin-top:10px;" method="post">
	<input type="text" name="benutzername" value="Benutzername" style="height:10px; width:30px; font-size:9px;" onfocus="if(this.value=='Benutzername')this.value=''" onblur="if(this.value=='')this.value='Benutzername'"> 
	<input type="password" name="passwort" value="Passwort" style="height:10px; width:30px; font-size:9px;" onfocus="if(this.value=='Passwort')this.value=''" onblur="if(this.value=='')this.value='Passwort'"> 
	<input type="submit" value="Log In" style="width:0px; height:0px; background-color:#000D1D; border:none;">
</form>

Nicht wundern, der Submit-Button ist 0px hoch und breit, weil man die Eingabe lediglich mit 'Enter' bestätigen soll (Vorgabe vom Auftraggeber).

Nun, nach diesem <form> steht im IE ein Abstand, der das Design zerhaut, wie beim Thread-eröffner auch.

Und da ich gesehen habe, dass ihr diesem helfen konntet, dachte ich mir, schafft ihr das bei mir vielleicht auch -> ich hoffe, mir kann jemand helfen :-D


Liebe Grüße,
L.T.M

 

[Prophet]

Hallo LTM schön dich endlich mal wieder hier im forum zu erblicken. :-)

Ich vermute das es an der block eingenschaft der submit-buttons oder des forumlars liegt wenn die oben genannte lösung nicht funktioniert.

Versuche einfach mal einem der beiden (oder auch beiden) die eigenschaft display:inline; zuzuweisen.

Im übrigen gibt man in css alle numerischen werte mit einer einheit an (auch wenn es bei einer null nicht erforderlich ist)!

 

[L.T.M]

Schön, dass es wohl doch den ein oder anderen gab, der mich damals nicht gehasst hat :lol:

Zurück zum Thema, dein Lösungsvorschlag, bewirkt, dass der Abstand kleiner wird..ganz weg ist er aber leider nicht.