CC: Alternative zum IE - Box Model Hack?

Hallo,

mal eine Frage um mein Gewissen zu beruhigen. :)
Natürlich ist mir das Box Model - Problem mit dem IE5.x/Win bekannt. Jetzt heisst es überall entweder padding und border mit festen Breiten vermeiden oder verschachtelte Elemente, bzw. Tanteks Hack anwenden. Dabei komme ich (jedenfalls subjektiv) bereits seit Ewigkeiten mit !important zum gleichen Ergebnis. Habe ich da ein Problem übersehen, dass mir bei Testen bisher nicht aufgefallen ist oder warum wird nirgends über !important in diesem Zusammenhang berichtet?

Gruss
CC

  1. Moin!

    Natürlich ist mir das Box Model - Problem mit dem IE5.x/Win bekannt. Jetzt heisst es überall entweder padding und border mit festen Breiten vermeiden oder verschachtelte Elemente, bzw. Tanteks Hack anwenden. Dabei komme ich (jedenfalls subjektiv) bereits seit Ewigkeiten mit !important zum gleichen Ergebnis. Habe ich da ein Problem übersehen, dass mir bei Testen bisher nicht aufgefallen ist oder warum wird nirgends über !important in diesem Zusammenhang berichtet?

    Würdest du deinen Vorschlag noch ein wenig ausführen?

    Namen irgendwelcher Hacks interessieren mich eher weniger. Aber ich habe eigentlich noch keinen Hack gesehen, den man abschließend als wirklich "sicher" bezeichnen könnte.

    Meine Vorgehensweise ist eigenlich immer gewesen, in der Tat die gleichzeitige Zuweisung von border und/oder padding in Verbindung mit width zu vermeiden. Der Vorteil dabei: Das Resultat ist allein auf Basis der existierenden CSS-Regeln eindeutig definiert.

    Alle "Hacks" haben immer das Problem, dass sie von gewissen Voraussetzungen im Können oder Nichtkönnen der Browser ausgehen.

    Tanteks Hack funktioniert beispielsweise nur dann, wenn der Browser

    • entweder das Box-Model nicht versteht _und_ das erste "}" im CSS als Regelende sieht (deswegen der Klimmzug mit voice-family),
    • oder das Box-Model versteht, und den Klimmzug mit Voice-Family auch erkennt,
    • oder aufgrund gewisser anderer Unstimmigkeiten im eigenen CSS-Verständnis zumindest die letzte Regel kennt, und damit die korrekte Breite sieht.

    Glücklicherweise gibts derzeit keinerlei Browser, die nicht unter eine dieser Kategorien fallen. Insbesondere ist der IE als böser Kandidat zu betrachten, denn noch weiß niemand, inwiefern Microsoft beim nächsten Update nicht irgendwelche dummen Bugs einbaut, die den Browser dann zufällig durchs Raster fallen lassen.

    Man zitiert mich unter http://www.parterremedia.de/csswork/css-box-modell/boxmodell-04.html mit diesem Beitrag im Selfforum: http://forum.de.selfhtml.org/archiv/2002/4/8574/#m47646.

    Auch wenn der Beitrag nun nahezu zwei Jahre alt ist, denke ich nicht, dass sich die Lage seitdem wirklich geändert hat. Sie hat sich lediglich aufgrund der fehlenden Updates seitens Microsoft noch nicht wirklich dramatisch aktualisiert, man konnte also entweder mit den immer näher am Standard agierenden "anderen Browsern" wie Opera, Mozilla, Safari, Konqueror etc. rechnen, die sowieso in Sachen "Breite" immer schon alles richtig gemacht haben, oder auf der anderen Seite mit dem IE und dessen Unzulänglichkeiten agieren.

    Ich sehe auch in der täglichen Realität nicht das Problem. Mein "Hack"-Vorschlag addiert zum HTML statt eines einzelnen <div> ein doppeltes <div><div>. Das äußere <div> kriegt die Breite, das Innere border und padding - und fertig ist der "Hack".

    Dieser Hack hat keinen Namen. Hab' ich damals wohl vergessen, für mich zu reklamieren. :) Oder jemand anderes war schneller als ich und hat sich das Teil vor mir ausgedacht, ihm aber auch keinen Namen gegeben. Egal. Ist in jedem Fall ein zuverlässiger Hack, egal welcher Browser kommt. Wenn man denn überhaupt hacken will.

    - Sven Rautenberg

    --
    "Habe den Mut, dich deines eigenen Verstandes zu bedienen!" (Immanuel Kant)
    1. Hallo,

      Würdest du deinen Vorschlag noch ein wenig ausführen?

      sorry, hat sich irgendwie erledigt. Ich habe eben gerade das Ganze nochmal ausführlich getestet und es läuft zwar im IE5.0, 6.0, Opera 6 und 7, Netscape 6 und 7 und Mozilla, aber nicht im IE5.5 und ist damit irgendwie wertlos. Ich hatte mir einfach zu Nutze gemacht, das der IE !important nicht anerkennt und mit einer zweiten Breitangabe die erste mit !important ausgezeichnete überschrieben, so dass die Gesamtbreite dem entspricht was alle Standard-kompatiblen Browser aus dem ersten Wert machen.

      Gruss
      CC

    2. Hi,

      Man zitiert mich unter http://www.parterremedia.de/csswork/css-box-modell/boxmodell-04.html mit diesem Beitrag im Selfforum: http://forum.de.selfhtml.org/archiv/2002/4/8574/#m47646.
      Auch wenn der Beitrag nun nahezu zwei Jahre alt ist, denke ich nicht, dass sich die Lage seitdem wirklich geändert hat.

      ich halte zwar auch nicht viel von Hacks, setze sie aber dennoch mitunter ein.
      Gerade der Tantek-Hack hatte mir nie besonders gefallen, da er nicht nur Unfähigkeiten ausnutzt, sondern auch eine unsinnige Deklaration produziert, die im Nachhinein wieder zurückgenommen werden muß.
      Nur - seit Deinem Beitrag hat sich etwas geändert soweit ich weiß: der IE6 hat einige Bugs ausgemerzt, die u.U. eine Abgrenzung gegenüber Vorgängerversionen erfordert. Und da trifft es sich doch gut, daß er auch diesen Hack jetzt durchschaut.

      freundliche Grüße
      Ingo

  2. Hallo,

    important ist hier als valider CSS-Filter erwähnt http://www.lipfert-malik.de/webdesign/tutorial/css.html#IEexpression (etwas zurückscrollen).

    Aber es gibt ja noch andere Weichen, sowohl CSS-Weichen als auch Conditional Comments.

    Vielleicht scheinen dir die Conditional Comments ähnlich wie hier eingesetzt http://www.lipfert-malik.de/webdesign/tutorial/bsp/NBdemo.html zuverlässiger, etwa hinsichtlich zukünftiger Browser.

    Grüsse

    Cyx23