max-height

[Markus]

Hallo erstmal,

ich verwende in einem div-tag die css-Eigenschaft "max-height". Dummerweise will die im $%&!§$!& Internet Explorer ja nicht. Firefox stellt jedoch alles so dar wie ich es will.

Gibts da denn gar keine Alternativen? Einen iFrame kann und will ich nicht verwenden.

Danke schon mal für eure Hilfe

Gruss,
Markus

[Gernot Back]

Hallo Markus,

ich verwende in einem div-tag die css-Eigenschaft "max-height". Dummerweise will die im $%&!§$!& Internet Explorer ja nicht. Firefox stellt jedoch alles so dar wie ich es will.

Gibts da denn gar keine Alternativen? Einen iFrame kann und will ich nicht verwenden.

Vielleicht, indem du mit behavior etwas trickst. Das ist im Grunde als CSS getarntes JavaScript. Da könntest du durch Abgleich der CSS-Height-Eigenschaft mit der offsetHeight desselben Elements vielleicht was machen.

Als EventHandler bietet sich da vielleicht oncontentready an. Ich muss aber zugeben, dass ich mit Behaviors und HTC-Dateien selbst noch nie gearbeitet habe.

Gruß Gernot

[wahsaga]

hi,

Vielleicht, indem du mit behavior etwas trickst. [...]
Als EventHandler bietet sich da vielleicht oncontentready an.

Da bietet sich eine Lösung mit der expression-Syntax doch vielleicht eher an:
http://www.svendtofte.com/code/max_width_in_ie/

gruß,
wahsaga

[Gernot Back]

Hallo wahsaga,

Als EventHandler bietet sich da vielleicht oncontentready an.

Da bietet sich eine Lösung mit der expression-Syntax doch vielleicht eher an:
http://www.svendtofte.com/code/max_width_in_ie/

Das hängt aber womöglich wieder davon ab, ob Markus eine relative (auf Elternelement oder Schriftgröße bezogene) Max-Height wünscht oder eine nur auf das Element selbst bezogene Max-Height, also eine absolute in Pixeln.

Ist jetzt erst mal nur so ein Gefühl, nachdem ich deinen Link überflogen habe.
;-)

Gruß Gernot

[Markus]

Da bietet sich eine Lösung mit der expression-Syntax doch vielleicht eher an:
http://www.svendtofte.com/code/max_width_in_ie/

gruß,
wahsaga

Ich glaub es nicht, tatsächlich, es klappt. 1000 Dank, hatte die Hoffnung da eigentlich schon fast aufgegeben :-).

Gruss,

Markus

[Mel]

Ich finde das auch sehr sehr genial, genau das hab ich gesucht -
jetzt hab ich das eben mit max-width ausprobiert. Sieht gut aus, nur fällt mir auch dass es nicht sooo zuverlässig funktioniert. Will sagen: wenn ich das Browserfenster zusammenschiebe um einen kleineren Viewport zu testen bleiben die Inhalte trotzdem auf voller Breite und es gibt horizontale Scrollbalken. Aber eben nur manchmal. Kennt jemand dieses Phänomen? Woran könnte das liegen?

vg melanie

[Cyx23]

Hallo Melanie,

jetzt hab ich das eben mit max-width ausprobiert. Sieht gut aus, nur fällt mir auch dass es nicht sooo zuverlässig funktioniert. Will sagen: wenn ich das Browserfenster zusammenschiebe um einen kleineren Viewport zu testen bleiben die Inhalte trotzdem auf voller Breite und es gibt horizontale Scrollbalken. Aber eben nur manchmal. Kennt jemand dieses Phänomen? Woran könnte das liegen?

Die Verlässlichkeit von Expressions hängt u.U. auch vom doctype bzw. Rendermodus ab.
Grundsätzlich ist von expressions eher abzuraten, besonders wenn mehrere gleichzeitig
nötig sind. Du kannst ja mal schauen ob dir diese Beispiele irgendwie weiterhelfen:
http://www.lipfert-malik.de/webdesign/tutorial/typo.html
http://www.lipfert-malik.de/webdesign/tutorial/bsp/3spaltenxhtml3.html
http://www.lipfert-malik.de/webdesign/tutorial/bsp/ie-max-min-width.html
Oder kannst du vielleicht ein Beispiel mit dem problematischen Code verlinken?

Grüsse

Cyx23

[Mel]

Hallo Cyx23,

beispiel kann ich leider nicht posten, ist geschützer Bereich...
Vielen Dank für die links der letztere sieht sehr verheissungsvoll aus den werde ich dann mal testen.

Ich brauche diese expression zwar nur einmal aber die Problematik ist trotzdem da. Den Workaround mit Tabellen kenne ich auch habe aber Srupel diesen einzusetzen. Ausserdem habe ich an anderer Stelle gelesen dass der table-Workaround nicht mehr funktioniert falls sich weitere Tabellen darin befinden. Leider ist dies bei mir der Fall (es sind tabellarische Daten ;)

ABer Du hast mir schonmal eine gute Richtung gegeben, vielen Dank.
Melanie

[Mel]

Hallo, ich hätte nochmal eine kurze Frage zu diesem Thema: kann es sein dass diese expressions-Angabe nicht valide ist bei Verwendung von xhtml strict?

mein css:
div#container-ie {
margin: 0 auto;
width:expression(document.body.clientWidth > 1000? "1000px": "auto" );/*be nice to IE WIN*/
}

validator sagt:

Fehler
URI : file://localhost/TextArea

* Zeile: 68 Kontext : div#container-ie

Ungültige Nummer : width Einlese-Fehler - document.body.clientWidth > 1000? "1000px": "auto" )

Wäre sehr dankbar für einen tipp,

melanie

[Cyx23]

Hallo,

Hallo, ich hätte nochmal eine kurze Frage zu diesem Thema: kann es sein dass diese expressions-Angabe nicht valide ist bei Verwendung von xhtml strict?

Expresions sind kein CSS bzw. proprietär und als CSS nicht valide, wenn du da
entspr. Meldungen usw. ausschliessen möchtest kannst du ja zusätzlich conditional comments
verwenden.

Innerhalb der xhtml-Auskommentierung gibt es aber vmtl. keine Meldung über invalides HTML.

width:expression(document.body.clientWidth > 1000? "1000px": "auto" );/*be nice to IE WIN*/

Da kann es übrigens u.U. günstiger sein mit verschiedenen Werten als 2x 1000 zu arbeiten.

Grüsse

Cyx23

[Mel]

Hallo Cyx,

Expresions sind kein CSS bzw. proprietär und als CSS nicht valide, wenn du da
entspr. Meldungen usw. ausschliessen möchtest kannst du ja zusätzlich conditional comments
verwenden.

Ja bloss hab ich auch bei dem von Dir verlinkten Artikel nicht verstanden wie das gehen sollte.. pack ich das dann in eine externe datei, speichere es als .js ab und lade diese Datei über CC?

Da kann es übrigens u.U. günstiger sein mit verschiedenen Werten als 2x 1000 zu arbeiten.

Hmm das verstehe ich nicht. Ich muss leider zugegben dass ich diese Anweisung an sich nicht verstehe. Ich sehe nur den Effekt, ich weiss nicht was die erste und die zweite Zahl bedeuten...

Über Aufklärung bin ich natürlich sehr dankbar...

vg melanie

[Cyx23]

Hallo Melanie,

Ja bloss hab ich auch bei dem von Dir verlinkten Artikel nicht verstanden wie das gehen sollte.. pack ich das dann in eine externe datei, speichere es als .js ab und lade diese Datei über CC?

Wenn es als externes JavaScript laufen soll gibt es mehrere mögliche Weichen, z.B. per CCs, oder
vielleicht das Script als JScript einbinden, oder Browsereigenschaften per JavaScript abfragen.
Du müsstest natürlich dann noch die expressions in "richtigeres" JavaScript übersetzen, vgl. dazu auch:
http://www.lipfert-malik.de/webdesign/tutorial/css.html#IEexpressionDHTML.

Wenn du aber einfach die Expressions wie bei deinem Code als CSS umsetzen willst kannst du den
Aufruf einer externen Styledatei in CCs setzen, ansonsten einfach einen zweiten Style-block, vgl.
http://www.lipfert-malik.de/webdesign/tutorial/css.html#BrowserweichenConditional

Über Aufklärung bin ich natürlich sehr dankbar...

width:expression(document.body.clientWidth > 1000? "1000px": "auto" );

Es ist eine Vermengung von CSS mit JavaScript. Da wird im CSS über "expression(..)" in
(IE-)JavaScript-Syntax abgefragt ob der Body breiter ("document.body.clientWidth") als 1000
Pixel ist oder nicht.
Diese Abfrage wird (vergleichbar einem setInterval) automatisch immer wieder durchgeführt.
Entspechend wird dem Body die Styleeigenschaft width je nach Breite des Body einmal mit 1000px,
im anderen Fall mit auto zugewiesen.

Also Breite gleich 1000px wenn der Body breiter als 1000 Pixel ist, und sonst auto.
Das "?" entspricht einem "if", konkret hier "if(document.body.clientWidth > 1000)",
der ":" einem "else".

Grüsse

Cyx23