Don P: Design proportional mit Schriftgröße skalieren

Hallo,

Folgendes Problem: Wenn ich im Browser die Schrift vergrößere/verkleinere, z.B mit Ctrl+/Ctrl- im FireFox, dann ändert sich auch das ganze Layout (von Grafiken mal abgesehen), d.h. Buttons, input-Felder, Div-Maße usw. werden dann kleiner/größer, und das ist gut so.

Leider ändern sich aber auch die Proportionen, z.B. die Breite einer Textzeile über einem Eingabefeld ändert sich nicht linear im Vergleich zur Breite des Eingabefeldes:

Groß:

Text Text Text Text Text Text Text
.----------------------.
|                      |
|         Feld         |
|                      |
.----------------------.

Klein:

Text Text Text Text Text Text Text
.--------------------------------------------.
|                                            |
|                      Feld                  |
|                                            |
.--------------------------------------------.

Gibt es eine Möglichkeit es zuverlässig so zu gestalten, dass sich alles genau proportional vergrößern/verkleinern lässt?

Gruß, Don P

  1. Gibt es eine Möglichkeit es zuverlässig so zu gestalten, dass sich alles genau proportional vergrößern/verkleinern lässt?

    das stichwort heisst relative angaben

    wenn du die breite und höhe von allen elementen in em definierst, sind diese an die schriftgröße gekoppelt - ändert sich die schriftgröße, ändern sich alle anderen daran gebundenen dinge ebenfalls