CSS: simulare la proprieta' max-width in Internet Explorer



Interne Explorer continua ad essere suo malgrado uno dei browser più utilizzati: tuttavia per 'scelta costruttiva' o per altre motivazioni che ignoro continua a non supportare parecchie proprietà CSS2, tra le quali le comodissime max-width, max-height, min-width e min-height.

max-width in particolare risulta molto comoda nel caso sia necessario limitare la dimensione massima di un elemento, in modo che lo stesso possa però ridimensionarsi qualora le dimensioni della pagina del browser vengano ridotte.

Internet Explorer implementa tuttavia delle specifiche proprietarie che permettono di eseguire all'interno del foglio di stile delle espressioni scritte con la sintassi del javascript.

Affiancheremo quindi alla dichiarazione letta dal resto dei browser a una specifica per IE:

[sourcecode language='css']

div {
max-width:600px;
width:expression(document.body.clientWidth > 600? "600px": "auto" );
}

[/sourcecode]
In questo modo viene verificato che la finestra del browser abbia dimensioni maggiori di 600 pixels e in quel caso viene settata la dimensione del DIV a 600 pixels.
Se le dimensioni sono minori o uguali la larghezza dell'elemento viene settata in modalità automatica.

Published: March 04 2008

  • category: