Formularansicht mit unerschiedlichen Browsern

[Markus]

Hallo zusammen!

Ich melde mich mal wieder hier vom verregneten Niederrhein.

Diesmal stehe ich vor einem Problem, was die Darstellung von Formularen in den unterschiedlichen Browsern und deren Versionen angeht.

Also mal konkret:
Ich habe ein Formular erstellt, was ihr euch unter http://privat.schlund.de/M-Franzen/test.htm ansehen könnt.

Das Formular besteht aus "normalen Eingabefeldern", die ich z.B. mit <INPUT type=text name="realname" SIZE="40"> festgelegt habe, aus "Auswahlfeldern" a la <SELECT name="BundeslandInland">...<OPTION> und aus "Textboxen" wie <TEXTAREA NAME="inlandtext" ROWS="7" COLS="38">.

Erstellt habe ich das Formular per Editor und immer mit dem Netscape 4.05 kontrolliert.
Also mit dem NN 4.05 sieht es jetzt richtig gut aus.
Als ich mir das Formular jedoch mit dem IE 4.01 angeschaut habe, sträubten sich mir die Haare. Genauso war es mit dem Navigator 3.01 und extrem mit dem Navigator 2.01 (o.k., den hat wahrscheinlich auch fast keiner mehr).

Die "normalen Eingabefelder", die ich auf 40 Pixel festgelegt habe, sehen bei allen Browser noch gleichlang aus. Das ist also o.k.

Bei den "Auswahlfeldern" habe ich bei Self-HTML gelesen, dass die Breite der Listenanzeige automatisch ermittelt wird, abhängig vom längsten Eintrag. Und der ist bei mir "Mecklenburg-Vorpommern". Also habe ich mir gedacht, um auf die Länge von 40 Pixeln zu kommen, hänge ich an "Mecklenburg-Vorpommern" 'ne Latte von Leerzeichen.

Klappt beim Navigator 4.05 auch gut. Nur bei den anderen Browsern ist das Feld entweder zu lang oder zu kurz...

Den "Textboxen" habe ich die Länge von 38 Pixeln gegeben, weil sie noch einen Scrollbalken besitzen. Sie sind unter dem Navigator 4.05 jetzt gleich lang, wie die "Eingabe- und Auswahlfelder".
Leider nicht beim IE und den anderen Navigatoren-Versionen. Dort sind die Textboxen viel zu kurz.

Alles in allem ist das ziemlicher Mist.
Ich habe vorläufig ganz nach unten an die Datei ein "Dieses Formular ist optimiert für den Netscape Navigator 4.x" gehängt. Aber das sollte eigentlich kein Dauerzustand werden.

Also hat da jemand eine Lösung für mich? Und noch eine Bitte: Ich habe zwar schonmal was von CSS gehört, aber keine Ahnung davon. Also wenn jemand antwortet, dann bitte nicht: "Das geht mit CSS!", sondern bitte sagt mir, wie es dann mit CSS geht, bzw. wo es die Anleitung dafür gibt. ;-)

Danke!

Markus

[Stefan Muenz]

Hallo Markus

zuvorderst mal: Angaben wie size= oder cols= haben nichts mit Pixeln zu tun, sondern damit, wie viele Zeichen der Browser (bei einer von ihm angenommenen Schriftart?) in das Feld bzw. eine Zeile reinkriegt.

Also hat da jemand eine Lösung für mich? Und noch eine Bitte: Ich habe zwar schonmal was von CSS gehört, aber keine Ahnung davon. Also wenn jemand antwortet, dann bitte nicht: "Das geht mit CSS!", sondern bitte sagt mir, wie es dann mit CSS geht, bzw. wo es die Anleitung dafür gibt. ;-)

Die gute Nachricht: Es gibt sowohl HTML- also auch CSS-Angaben dafuer. Die schlechte: die HTML-Angaben sind von Netscape 4.0 eingefuehrt worden, werden nur von diesem interpretiert und gehoeren nicht zum HTML-Standard; die CSS-Angaben sind Standard, werden aber im Zusammmenhang mit Formularen soweit ich weiss bislang nur vom MS IE 4 interpretiert. Netscape 3 wird also immer "irgendwas Ungefaehres" anzeigen, aber daran muessen sich Benutzer, die sich nach eineinhalb Jahren immer noch weigern upzudaten, eben langsam mal gewoehnen.

Und jetzt ein paar Beispiele:
<input size=40 width=200 style="width:200px">
<select width=150 style="width:150px">
<textarea cols=40 rows=10 width=250 style="width:250px"></textarea>

Die Angaben zu size und cols sind fuer Netscape 3 und andere alte Browser gedacht. width= ist HTML-Syntax nach Netscape 4, die style="..."-Angaben CSS, wie es der MS IE interpretiert. Netscape kennt neben width= wohl auch height=, was in CSS (mehrere Angaben bei style="...." immer durch Semikolon trennen!) mit height:###px geht. Auch zur Schriftart innerhalb der Felder gibt es Angaben. Bei Netscape gibt's da irgendwas mit font= und einiges mehr (weiss nicht mehr genau), was aber angesichts von CSS voelliger Unsinn ist. In CSS naemlich steht das ganze Arsenal zur Schriftformatierung zur Verfuegung, wie z.B.:
font-family:Arial; font-size:12pt; font-weight:bold usw. Und natuerlich auch CSS-Angaben wie background-color:#FFFFCC, color:red und was weiss ich alles. Angewendet auf Formularelemente wie <input>, <select> oder <textarea>, ist das beim MS IE 4 ein echtes Erlebnis, er macht praktisch alles, was man ihm sagt.

Wenn Dir das jetzt zu wirr ist, dann solltest Du vielleicht doch mal das CSS-Kapitel lesen.

Viele Gruesse
  Stefan Muenz

[Markus]

Hi Stefan!

zuvorderst mal: Angaben wie size= oder cols= haben nichts mit Pixeln zu tun, sondern damit, wie viele Zeichen der Browser (bei einer von ihm angenommenen Schriftart?) in das Feld bzw. eine Zeile reinkriegt.

Ach so ;-)

Prima! Vielen Dank für die Hilfe! Beim Navigator 4.05 und IE 4.01 sieht es jetzt gleich aus.
Nur der Navigator 3.01 kränkelt noch, aber du erwähntest ja, dass man das nicht so genau hinkriegt...

Ach ja, bezogen auf deinen Satz: "...aber daran müssen sich Benutzer, die sich nach eineinhalb Jahren immer noch weigern upzudaten, eben langsam mal gewöhnen.":
Alle für Studenten zugänglichen PCs an der Duisburger Uni haben immer noch den Navigator 3.0 drauf... 8-(

Markus