Willkommen auf dem Portal für Mediengestalter

_Paul_ · Threadersteller

Hallo,

ich habe soeben etwas festgestellt dass ich mir nicht wirklich erklären kann.

Und zwar habe ich ein Input-Element mittels CSS formatiert:
input#suchformular
{
width:28em;
height:1.8em;
font-size:1.5em;
text-align:center;
padding:0em auto;
}

Dieses Input-Element habe ich in einen 28.2em breiten Div-Container eingefügt. Dabei passierte etwas merkwürdiges: Width nahm die font-size als Maßstab für die Berechnung. Soll heißen, es wurde 1.5em x 28em gerechnet anstatt 1em x 28em. Das wundert mich ein wenig, denn em bezieht sich doch auf die Default-Schriftgröße des Browsers (die ist bei mir auf 16px eingestellt).
Ich habe das Problem jetzt erkannt und auch für mich gelöst, allerdings weiß ich überhaupt nicht wie es zu diesem Problem kommt.
Könnte mir da jemand einen Denkanstoß geben?

Danke schonmal :)

bacon · **Verfasst** Mo 07.07.2008 11:18 **Titel**

[em] bezieht sich immer auf die Schriftgröße des aktuellen Elements, nicht auf die Standardschriftgröße des Browsers. Gibst du die Eigenschaft "font-size" in [em] an, wird logischerweise die Schriftgröße des Elternelements zu Grunde gelegt

_Paul_ · Threadersteller

Oh, wie peinlich... Na, jetzt weiß ichs besser. Danke dir! :)

bacon · **Verfasst** Mo 07.07.2008 17:15 **Titel**

Das ist aber 'ne weitverbreitete Legende... auch diese 16px: Hab' jetzt ehrlich gesagt nicht den Überblick, was die Browser da so alle als Standardimplementierung liefern, aber im Grunde reicht es wohl, wenn man in irgend nem Rootelement (<body> meinethalben) eine Grundschriftgröße festlegt, die einigermaßen elegantes rechnen ermöglicht. Es gibt da n paar Kniffe, die sind mir jetzt aber nicht präsent.

Willkommen auf dem Portal für Mediengestalter

Thema: HTML: Input-Formatierung vom 07.07.2008

HTML: Input-Formatierung