Masseinheit em: Bilder und Input-Elemente

[KeinBlase]

hallo

Ich habe 2 Fragen betreffend der Masseinheit em.

1. Wie kann ich machen, dass auch Input-Elemente skalieren, wenn ich eine Skalierung via Browser (z.b. Firefox CTRL & +/-) mache? Bei mir bleiben die Input-Elemente immer gleichgross obwohl ich die Grösse der Input-Elemente mittels EM definiert habe.

2. Wie kann ich machen, dass auch Bilder skaliert werden? Bei mir bleiben die Bilder in der Orginalgrösse. Bei den Bilder stehen die Angaben aber ohne Masseinheit, z.B. width="28" height="11". Wie kann ich das machen? Oder weiss jemand wie es http://www.tagesschau.de/ gemacht haben?

Thx

[Matze]

Hallo,

1. Wie kann ich machen, dass auch Input-Elemente skalieren, wenn ich eine Skalierung via Browser (z.b. Firefox CTRL & +/-) mache? Bei mir bleiben die Input-Elemente immer gleichgross obwohl ich die Grösse der Input-Elemente mittels EM definiert habe.

wie hast du sie denn definiert? Wie sieht also dein Quelltext aus?
Eigentlich funktioniert es.

2. Wie kann ich machen, dass auch Bilder skaliert werden?

Wenn du eine Breitenangabe in % gibst, passt sich dein Bild entsprechend des Elternelementes an. Dabei gibt es aber Qualitätsverluste.
Ich weiß jetzt nicht, ob man einem <img> per CSS auch Breitenangaben in em geben kann. Sollte aber funktionieren - denke ich ;)

Grüße, Matze

[KeinBlase]

Herzlichen Dank, das mit den Bildern stimmt nun (Ich habe einfach eine allgemeine Definition für img gemacht.)

Zu den Input-Elementen:

Quellcode:

<div class="login_input">
  <input name="searchterm" value="Suche" type="text">
  <select id="area" name="area" onchange="searchUrl(this.selectedIndex)">
    <option value="Webseite" selected="selected">auf Webseite</option>
  </select>
</div>
<div class="login_submit">
  <input name="Button" value="&gt;" onclick="javascript:document.forms['loginform'].submit()" type="submit">
</div>

CSS:

.login_input input{
 border: 0.1em solid #333333;
 margin: 0.2em 0em 0em 0em;
 padding: 0em  0em 0em 0.625em;
 background-color: #FFFFFF;
 height: 1.6em;
 width: 12em;
 }
.login_input select{
 border: 0.1em solid #333333;
 margin: 0.2em 0em 0em 0em;
 padding: 0em  0em 0em 0.2em;
 background-color: #FFFFFF;
 height: 1.6em;
 width: 12em;
 }
.login_input option{
 padding: 0em  0em 0em 0.6em;
 height: 1.6em;
 width: 12em;
 }

THX

[Mati]

Hallo,

Du kannst so ziemlich allem was eine Größeneinheit hat auch die Einheit em geben.

Wenn Du z.b. Billder mit scalieren lassen willst, natürlich nicht verlustfrei!, gibst Du auch bei breite&höhe em als masseinheit an.

Ein tolles Tool was Dir helfen kann die richtigen Werte zu ermittel ist hier http://riddle.pl/emcalc/

Gruß
mati

[ChrisB]

Hi,

1. Wie kann ich machen, dass auch Input-Elemente skalieren, wenn ich eine Skalierung via Browser (z.b. Firefox CTRL & +/-) mache? Bei mir bleiben die Input-Elemente immer gleichgross obwohl ich die Grösse der Input-Elemente mittels EM definiert habe.

Hast du denn auch ihre font-size in em angegeben - oder erhalten sie ihre Schriftgroesse nach wie vor aus der vermutlich im Default-Stylesheet des Browser fest angegebenen Schriftgroesse?

MfG ChrisB