nicht angemeldet
Formularfelder formatieren
0 0 0 0 0
0 0
Formularfelder formatieren
Hello,
ich bin leider noch nicht weitergekommen mit meinem Latein:
<zitat aus Self:>
Mit CSS Stylesheets können Sie Formulare und Formularelemente optisch gestalten. Welche Gestaltungsmöglichkeiten funktionieren, ist jedoch noch ein Glücksspiel. Diejenigen Browser, die das Formatieren von Formularelementen mit CSS unterstützen, unterstützen es noch nicht konsequent. Ausprobieren ist also angesagt.
</zitat>
Eigentlich möchte ich doch nur, dass sich ein Formularfeld in der Breite in 'em' festlegen kann.
Leider kann ich einfach nicht herausfinden, auf welchen Font und welche Font-Size ggf. welchen Mutter- oder Vaterelementes sich das nun bezieht.
Die Browser reagieren zwar auf die Angabe "widht:20em", aber die Breite ist gundsätzlich zu groß. Woher beziehen die ihre Referenz denn nun?
Wer kann mir über die "Erbfolge" 'was Verbindliches sagen?
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
-
Hi,
Eigentlich möchte ich doch nur, dass sich ein Formularfeld in der Breite in 'em' festlegen kann.
Leider kann ich einfach nicht herausfinden, auf welchen Font und welche Font-Size ggf. welchen Mutter- oder Vaterelementes sich das nun bezieht.Es bezieht sich auf die Größe des Fonts des formatierten Elements.
em bezieht sich mit einer einzigen Ausnahme IMMER auf die Größe des Fonts des Elementes, für das es benutzt wird.
Die einzige Ausnahme ist font-size - HIER UND NUR HIER bezieht sich em auf die Größe des Fonts des Elternelements.Die Browser reagieren zwar auf die Angabe "widht:20em", aber die Breite ist gundsätzlich zu groß.
Dann haben die Elemente in diesen Browsern vermutlich unterschiedliche font-Größen.
Wer kann mir über die "Erbfolge" 'was Verbindliches sagen?
Im Zweifelsfall der CSS-Standard: http://www.w3.org/TR/REC-CSS2/syndata.html#value-def-length:
The 'em' unit is equal to the computed value of the 'font-size' property of the element on which it is used. The exception is when 'em' occurs in the value of the 'font-size' property itself, in which case it refers to the font size of the parent element.cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
Hello,
The 'em' unit is equal to the computed value of the 'font-size' property of the element on which it is used. The exception is when 'em' occurs in the value of the 'font-size' property itself, in which case it refers to the font size of the parent element.
'ex' funktioniert so einigermaßen. Welche Breite 'em' benutzt, kann ich nicht nachvollziehen.
man sollte doch annehmen, dass bei
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/transitional.dtd">
<HTML>
<HEAD>
<TITLE>Input-Felder mit CSS</TITLE><style type="text/css">
.dialog
{
font-family:Arial, sans-serif;
font-size:10pt;
}
</style></HEAD>
<BODY>
<input class="dialog"
style="width:30em;"
type="text"
name="vorname" /></BODY>
</HTML>die Breite des Elementes auch ca. 30 Zeichen ausmacht und nicht 48.
Oder? Wo ist mein Denkfehler?
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau-
Hi,
'ex' funktioniert so einigermaßen.
1ex ist 0.5em.
Welche Breite 'em' benutzt, kann ich nicht nachvollziehen.
bei width entspricht 1em der Höhe des aktuellen Fonts.
man sollte doch annehmen, dass bei
style="width:30em;"
die Breite des Elementes auch ca. 30 Zeichen ausmacht und nicht 48.
wie kommst Du nur auf die Idee, daß ein Zeichen so breit wie hoch ist?
Oder? Wo ist mein Denkfehler?
u.a. darin, daß die Browser für input meist einen font vordefiniert haben, den Du berpcksichtigen oder überschreiben müßtest.
freundliche Grüße
Ingo-
Hi,
'ex' funktioniert so einigermaßen.
1ex ist 0.5em.Falsch.
Das kann zwar bei einem Font zufällig zutreffen, aber eine allgemeine Regel ist das nicht.1em ist die Höhe des Fonts (meist gemessen am M)
1ex ist die Höhe eines x.Meist ist ex größer als 0.5em (weil die Kleinbuchstaben höher als die Hälfte eines Großbuchstabens sind).
Bei vielen Fonts bewegt sich der Wert eher um 0,6180339887498948482045868343656... - dem goldenen Schnitt.cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
Hi,
1ex ist 0.5em.
Falsch.
Das kann zwar bei einem Font zufällig zutreffen, aber eine allgemeine Regel ist das nicht.doch. Allerdings zugegeben nicht in jedem Browser.
1em ist die Höhe des Fonts (meist gemessen am M)
Genau. AFAIK steht irgendwo als Definition die Fonthöhe, da nicht jeder Font ein "M" hat.
1ex ist die Höhe eines x.
Hier steht in der deutschen Übersetzung zu CSS 2:
"Die Einheit 'ex' ist durch die 'x-height' der Schrift definiert. Die x-Höhe wird so bezeichnet, weil sie häufig gleich der Höhe des kleinen „x“ ist. 'ex' ist jedoch selbst für Schriften definiert, in denen kein „x“ enthalten ist."Und das sehen die Browser in der Tat unterschiedlich. Analog zu em stellt sich die Frage, welches "x" man heranziehen soll in einem Font, der dieses Zeichen nicht enthält.
IE und Opera setzen daher ex praktisch um als 1/2 Fonthöhe und damit 0.5em.Mozilla sieht das etwas anders und stellt in der Tat ex je nach font abweichend von 0.5em dar. Bei Georgia als 0.5em, bei einigen anderen serif Fonts kleiner und bei sans-serif Fonts eher größer.
Ihr könnt das auf dieser Beispielseite gerne einmal nachprüfen (bitte Javascript aktivieren).Meist ist ex größer als 0.5em (weil die Kleinbuchstaben höher als die Hälfte eines Großbuchstabens sind).
aber nur, wenn Du die verbreiteteren serifenlosen Fonts stärker berücksichtigst.
Bei vielen Fonts bewegt sich der Wert eher um 0,6180339887498948482045868343656... - dem goldenen Schnitt.
Eine schöne Theorie, aber doch mMn eher Zufall.
Als Resüme bleibt festzuhalten, daß ex als Einheit wegen der unklaren Definition und sehr unterschiedlichen Umsetzung im Mozilla (und vielleicht noch anderen Browsern? Mich würde mal Safari interessieren) nicht praxistauglich ist.
freundliche Grüße
Ingo-
Hello,
Als Resüme bleibt festzuhalten, daß ex als Einheit wegen der unklaren Definition und sehr unterschiedlichen Umsetzung im Mozilla (und vielleicht noch anderen Browsern? Mich würde mal Safari interessieren) nicht praxistauglich ist.
ach Scheiße! *pardon*
Dann muss ich das alles also nochmal umbauen.
Für die Breite eines <input>-Feldes für 30 Zeichen kommen dann alse im Mittel wieviele 'em' in Betracht? Die Fonts, die in Frage kommen, sind Arial, Helvetiva, Century Gothic, sans-serif udn alle, die ähnlich aussehen. Es muss nicht genau passen, aber ich möchte doch eine möglichst genaue Annährung haben.Man kann das mittels JavaScript auch messen. Aber darauf (JavaScript vorzuschreiben) habe ich keinen Bock.
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau-
Hi,
Für die Breite eines <input>-Feldes für 30 Zeichen kommen dann alse im Mittel wieviele 'em' in Betracht? Die Fonts, die in Frage kommen, sind Arial, Helvetiva, Century Gothic, sans-serif udn alle, die ähnlich aussehen. Es muss nicht genau passen, aber ich möchte doch eine möglichst genaue Annährung haben.
wenn Du nicht wenigstens ungefähr weisst, was dort eingegeben wird, sehe ich schwarz bei diesen Fonts. Anders wäre das mit monotype wie hier, wo
iiiiiiiiii
und
wwwwwwwwww
genauso breit sind. Aber wozu brauchst Du das überhaupt so genau? Ist doch nicht unüblich, daß ein Eingabefeld schmaler als die maximal mögliche Zeicheneingabe ist. Wenn, dann würde ich eher den gegenteiligen Fall ausschließen wollen: daß nicht mitten in der Eingabezeile Schluß ist. Hierfür dürften allerdings testweise 30 i's oder Leerzeichen oder Punkte reichen.freundliche Grüße
Ingo-
Hello Ingo,
Für die Breite eines <input>-Feldes für 30 Zeichen kommen dann alse im Mittel wieviele 'em' in Betracht? Die Fonts, die in Frage kommen, sind Arial, Helvetiva, Century Gothic, sans-serif udn alle, die ähnlich aussehen. Es muss nicht genau passen, aber ich möchte doch eine möglichst genaue Annährung haben.
wenn Du nicht wenigstens ungefähr weisst, was dort eingegeben wird, sehe ich schwarz bei diesen Fonts. Anders wäre das mit monotype wie hier, wo
iiiiiiiiii
und
wwwwwwwwww
genauso breit sind. Aber wozu brauchst Du das überhaupt so genau? Ist doch nicht unüblich, daß ein Eingabefeld schmaler als die maximal mögliche Zeicheneingabe ist. Wenn, dann würde ich eher den gegenteiligen Fall ausschließen wollen: daß nicht mitten in der Eingabezeile Schluß ist. Hierfür dürften allerdings testweise 30 i's oder Leerzeichen oder Punkte reichen.Da hast Du eigentlich auch Recht.
Da die User gerne optisch unterstützt werden in einem ergonomischen Formular, werde ich auf monospace umsatellen mit einem Font, der bestimmt nicht zu groß und nicht zu klein wird und die Formatierung dann weider mit HTML (size="$n") vornehmen. Das passt jedenfalls.Schade, CSS wäre schön gewesen.
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
-
-
-
Hi,
Ihr könnt das auf dieser Beispielseite gerne einmal nachprüfen (bitte Javascript aktivieren).
Nur mal zur Info, vielleicht erinnert sich der ein oder andere an meinen Suchmaschinentest mit ausschließlich über das link-Element referenzierten Seiten und interessiert sich für die Entwicklung?
Als ich diese soeben neu erstellte und hochgeladene Seite mit dem Opera und Google-Werbung aufrief, kam prompt 1 Sekunde später der Mediapartners-Google/2.1 auf diese Seite. Wer aber jetzt denkt, daß das eine Möglichkeit wäre, neue Seiten (schneller) in den Google-Index zu bekommen: es besteht offensichtlich keine Verbindung zwischen Mediapartners-Google und dem Google Suchindex. Mediapartners-Google verwendet einen eigenständigen Datenbestand, in den für den allgemeinen Google-Suchindex unbekannte Seiten abgelegt, aber nicht weitergegeben werden.freundliche Grüße
Ingo
-
-
-
Hello,
'ex' funktioniert so einigermaßen.
1ex ist 0.5em.Das glaube ich nicht.
1em entspricht der Schrifthöhe des verwendeten Fonts
1ex entspricht der Höhe des kleinen Buchstaben x in diesem Font,
auch wenn der Font gar kein 'x' enthält, ist 1ex definiert (Vorgabe von CSS2).1ex = k*em ist, ist plausibel. Dass k aber immer gelich 0.5 wäre, wage ich zu bezweifeln.
http://www.edition-w3c.de/TR/1998/REC-CSS2-19980512/kap04.html#heading-4.3.2
Der Denkfehler steckt also in der Abmessung des em-Quadrates. Kaum ein Buchstabe nutzt das in der Breite wirklich aus. Man muss also bei jedem Font wissen, wie das Verhältnis im Mittel etwa ist, um für den Beutzer vernünftige Formulare zu bauen.
Vielen dank fürs Mit-, Nach- und Vordenken. ;-)
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
-
-
hi,
'ex' funktioniert so einigermaßen. Welche Breite 'em' benutzt, kann ich nicht nachvollziehen.
ex = höhe des buchstabens x, em = höhe des buchstabens M, IIRC.
man sollte doch annehmen, dass bei
<input class="dialog"
style="width:30em;"
type="text"
name="vorname" />
die Breite des Elementes auch ca. 30 Zeichen ausmacht und nicht 48.auf welche weise ziehst du denn den vergleich zu "48 zeichen"?
48 mal 'i' eingegeben? :-)
oder im vergleich zu einem textfeld mit size="48"?gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em." -
Hi,
<input class="dialog"
style="width:30em;"
type="text"
name="vorname" />
die Breite des Elementes auch ca. 30 Zeichen ausmacht und nicht 48.Du gibst 30mal die _HÖHE_ des Fonts als Breite vor, nicht 30mal die Breite eines Zeichens.
Wieviele Zeichen dann tatsächlich in den Bereich reinpassen, hängt vom Verhältnis Höhe/Breite der einzelnen Zeichen (und damit vom Font) ab.Insbesondere bei Proportionalfonts: verwendest Du zum Test, wieviele Zeichen reinpassen, ein kleines i oder ein großes W?
Bei Verwendung von z.B. Arial Condensed wirst Du ein anderes Ergebnis bekommen als bei Arial Extrawide.
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
Hello,
Du gibst 30mal die _HÖHE_ des Fonts als Breite vor, nicht 30mal die Breite eines Zeichens.
Wieviele Zeichen dann tatsächlich in den Bereich reinpassen, hängt vom Verhältnis Höhe/Breite der einzelnen Zeichen (und damit vom Font) ab.Der Fehler ist mir nun klar. Ich hatte mich hier vesehnelich auf ein Script verlassen, dass für em von der Breite des kleinen Buchstabens 'm' ausgegangen ist. Dann hätte die Logic ja in etwa gepasst. Inzwischen habe ich die CSS2-Doku nochmal befragt.
Danke auf jeden Fall.
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
-
-
-