Getestet mit Opera 9.64/8.54/7.54, IE 8/7/6, Firefox 3.0.8/2.0.0.18/1.5.0.12
(Schriftgröße ändern in und Hintergrundgrafik rechte Spalte ändern in benötigt Javascript)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent
fringilla, purus ultricies tincidunt malesuada, mauris arcu interdum
libero, eu convallis risus turpis sit amet nisl.
Nam vitae eros. Vestibulum accumsan. Aenean risus massa, vehicula
eget, accumsan sed, feugiat quis, leo.
Class aptent taciti sociosqu ad litora torquent per conubia nostra,
per inceptos himenaeos. Quisque scelerisque ligula ac purus. Integer
interdum dapibus erat. Quisque risus mi, imperdiet vitae, porta eu,
eleifend non, turpis. Aliquam erat volutpat enean risus massa,
vehicula eget, accumsan sed.
Nullam ac arcu vel magna posuere dignissim. Nam vitae eros. Vestibulum
accumsan.
Der blaue Hintergrund auf der rechten Seite wird mit der
Hintergrundgrafik des Wrappers erzeugt.
Im
moment
(Javascript-Link) hat die Hintergrundgrafik die Breite der
rechten Spalte (40em*16px/em=640px) und wird mit
background: rgb(153, 66, 58) url(VCSSLmvS_spalte.gif) repeat-y
right top;
eingebunden.
Ändert man nun die Schriftgröße z.B. in
125%(Javascript-Link) wird die Hintergrundgrafik zu kurz.
Bindet man die Hintergrundgrafik aber mit
background: rgb(153, 66, 58) url(VCSSLmvS_spalte-variabel.gif)
repeat-y 19.25em top;
ein und verdoppelt die Breite der Grafik von 640px auf 1280px, macht
das Layout bei einem Vergrößern der Schriftgröße auf bis zu 200%
mit.
Den
Hintergrund für variable Schriftgröße
(Javascript-Link) einbinden.
Mehr Text(Javascript-Link)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent
fringilla, purus ultricies tincidunt malesuada, mauris arcu interdum
libero, eu convallis risus turpis sit amet nisl. Nam vitae eros.
Vestibulum accumsan. Aenean risus massa, vehicula eget, accumsan sed,
feugiat quis, leo.
Class aptent taciti sociosqu ad litora torquent per conubia nostra,
per inceptos himenaeos.
Quisque scelerisque ligula ac purus. Integer interdum dapibus erat.
Quisque risus mi, imperdiet vitae, porta eu, eleifend non, turpis.
Aliquam erat volutpat. Vestibulum pulvinar. Nullam ac arcu vel magna
posuere dignissim.
Weniger Text