max- min-width workaround kombination

[molily]

Mit PHP würde ich eine Case- oder If-Elseif-Abfrage machen,
aber wie das hier funktioniert blicke ich nicht.

expression() kann den Aufruf einer JavaScript-Funktion enthalten, welche einen Wert mittels return zurückgibt. In dieser Funktion können beliebige JavaScript-Kontrollstrukturen benutzt werden. Ein Beispiel:

<script type="text/javascript">
function bla () {
 if (document.body.clientWidth) {
  if (document.body.clientWidth > 765) {
    if (document.body.clientWidth < 885) {
     // return "auto";
     return "red";
    } else {
     // return "585px";
     return "blue";
    }
   } else {
    // return "465px";
    return "green";
   }
  }
}
</script>
<style type="text/css">
div {
/* width:expression(bla()); */
color:expression(bla());
}
</style>

Ziehe das Fenster kleiner und die Textfarbe ändert sich. Die auskommentierten Zeilen wären jeweils die Werte für width.

max-width und min-width solltest du natürlich zusätzlich für Mozilla und Opera angeben - dann aber kein width in Form von width:123px vor der Deklaration width:expression().