dynamische div-weite

[Pixel-Wizard]

Hallo zusammen

Im moment arbeite ich gerade an einem Farbtool (tdpbeta.freeiz.com). Nun befasse ich mich immer mehr, mit der Zugänglichkeit meiner Projekte. So habe ich sie schon für fast alle Browser kompatibel gemacht. Auf die Fenstergrösse oder die Bildschirmgrösse kommt es seit kurzem auch nicht mehr drauf an (ausser mobil aber das wird schon noch). Nun habe ich noch das Problem, dass es für jeden User jederzeit möglich ist, die Schriftgrösse in seinem Browser zu ändern. Wenn die Schriftgrösse zum Beispiel um 2px erhöht wird, dann wird das ganze Layout verworfen und alles ist durcheinander.

Die einte Möglichkeit wäre natürlich, die Schriftgrösse zu setzen, doch ist das wirklich benutzerfreundlich? Natürlich ist es wahr, dass nur ein kleiner Teil, eine "grosse" Schriftgrösse hat (aufgrund von Sehschwäche oder so...) aber diese Leute sollte man nicht ausser acht lassen.

Wie kann man nun, unabhängig von der Schriftgrösse also dynamisch, die Weite eines Divs anpassen, damit der Text nicht überlappt oder zusammengedrückt wird (auf mehrere Zeile)?

Liebe Grüsse
Pixel-Wizard

 

[threadi]

Breitenangaben kann man ebenfalls mit anderen Werten als Pixel versehen. Wenn Du bspw. die Breiten von deinen 3 div-Elementen auf einheitlich 31em setzt, dann vergrößern sie sich mit der Schriftvergrößerung im Browser mit und es gibt keine Verschiebungen mehr.

 

[Pixel-Wizard]

Das ist eine gute Idee! Vielen Dank.

Kurze Frage. Was denkt ihr über die Webseite (Nutze, Design, Aufbau etc.)?

 

[Tronjer]

Die Seite ist total zerschossen, weil du versuchst Elemente mit position absolute im Viewport festzunageln. Wenn man den verkleinert, schiebt sich alles übereinander. Außerdem gibt es semantische HTML-Fehler. Die Links gehören in die Listenelemente und nicht umgekehrt, und die Navigation in eine <ul>.

 

[Pixel-Wizard]

Die Seite ist total zerschossen, weil du versuchst Elemente mit position absolute im Viewport festzunageln. Wenn man den verkleinert, schiebt sich alles übereinander.

Wie meinst du das? Wie verkleinern? Rauszoomen?

Außerdem gibt es semantische HTML-Fehler. Die Links gehören in die Listenelemente und nicht umgekehrt, und die Navigation in eine <ul>.

Was für eine Navigation?

Ich bezweifle dass wir aneinander vorbei reden. Ich meine diese Seite!

 

[Tronjer]

Ah ok, ich hatte die Seite in der Signatur gemeint.