Sven Rautenberg: Kann man dem IE das begreiflich machen?

Hallo Forum!

Anderswo ging die Diskussion darum, welches denn der beste Browser sei. Der IE ist es jedenfalls nicht, der versagt bei meiner neuen Seite komplett...

Naja, damit hier nicht nur M$-Bashing rauskommt, gibts ja vielleicht doch eine Lösung für das Problem.

Des Pudels Kern ist "position:fixed". Netscape 6.2 kanns, Mozilla kanns, Opera 5 kanns, nur IE 4, 5.5 und 6.0 kanns nicht! Dumm, äußerst dumm.

Nun hatte ich versucht, durch folgende Definition den "fixed"-Nichtkönnern zumindest ein "absolute" unterzuschieben:

#navi { position:absolute; position:fixed; top:20px; left:20px; width:150px; background-color:#0040ff; font-family:Arial,Helvetica,sans-serif; font-weight:normal; font-size:15px; color:#FFFFFF; padding:5px;}

Den "Trick" mit der doppelten Position-Definition habe ich von den offiziellen W3C-Seiten zum Thema CSS. Dort ist ein wirklich schön gestalteter fixed-Bereich - die Seite http://www.w3.org/Style/CSS/ sieht im Internet Explorer aber wirklich bescheiden aus.

Habe ich nicht in irgendeiner offiziellen CSS-Definition gelesen, daß ein Browser ihm unbekannte Definitionen ignorieren soll?

Naja, die interessante Frage ist: Wie bastel ich dem IE was zurecht, was:

  • ohne Javascript auskommt (separate CSS-Dateien je nach Browser sind ja nun wirklich ein Anachronismus)
  • ohne irgendwelches CSS-Hacking auskommt (es gibt da irgendeinen Trick, die Definition aufgrund eines Bugs im IE vorzeitig abzuschließen und für andere Browser noch Dinge nachzuschieben)
  • und trotzdem "position:fixed" nutzt.

Immerhin sind die Seiten mittlerweile (und das im Vergleich zu den vorherigen Tabellen auch ohne großen Aufwand) HTML 4.01 Strict valide, auch das CSS ist valide. Fehlt nur noch, daß der angeblich so tolle Internet Exploder das auch rafft.

Links zum selber gucken:
http://www.rtbg.de/sandkiste/index.html Das corpus delicti
http://www.rtbg.de/sandkiste/style.css Das Stylesheet
http://validator.w3.org/check?uri=www.rtbg.de%2Fsandkiste%2F&charset=(detect+automatically)&doctype=Inline Valides HTML
http://jigsaw.w3.org/css-validator/validator?uri=www.rtbg.de%2Fsandkiste%2F&warning=2&profile=css2 Valides CSS (mit einigen kleinen Warnungen...)

- Sven Rautenberg

  1. Hallo Sven,

    Anderswo ging die Diskussion darum, welches denn der beste Browser sei. Der IE ist es jedenfalls nicht, der versagt bei meiner neuen Seite komplett...

    Ich sehe Dein Problem gar nicht. Im IE sieht das so aus wie vorher und wer die feste Navigation nicht erwartet, vermisst diese auch nicht. Mir gefaellt das Mitscrollen sogar besser, als ein Text, der in Opera und Mozilla hinter Deinem Kopflogo scrollt.

    Du wolltest zwar keine JS-Loesung, aber AFAIK gibt es nur diese: Addiere zum top-Wert des DIVs den jeweils aktuellen document.body.scollTop-Wert, entweder ueber einen Timer oder <body onscroll="...">, wobei letzteres per document.write() geschrieben werden sollte, da onscroll IE-only. ist.

    MfG, Thomas

    BTW: Der IE 5 fuer Mac kennt position: fixed, hat aber Probleme mit Links in diesen Bereichen.

    PS: Die genannte W3C-Style-Seite rueckelt und roedelt in Mozilla 0.9.7 und diese Navigationsbox wirkt im Kontext merkwuerdig platziert ...

    1. Ich sehe Dein Problem gar nicht. Im IE sieht das so aus wie vorher und wer die feste Navigation nicht erwartet, vermisst diese auch nicht. Mir gefaellt das Mitscrollen sogar besser, als ein Text, der in Opera und Mozilla hinter Deinem Kopflogo scrollt.

      Ja, man kann darüber streiten, ob das Logo nun mitscrollt oder nicht, aber die Navigation sollte doch stehenbleiben können - deswegen wurden doch schließlich mal Frames erfunden, oder?

      Die Problematik (vermutlich noch nicht sehr gut dargelegt):
      Mit "position:absolute" allein ist alles kein Problem. Alles sieht gut aus, alles scrollt mit.

      Füge ich nur für die Navigation "position:fixed" hinzu, wird die linke Box leicht nach links versetzt. Füge ich diese Angabe auch für die Logo-Box hinzu, wird sie ganz nach links geklatscht, von Positionierung ist nichts mehr zu spüren... und dann siehe erstes Posting: Warum kann der IE nicht einfach "fixed" komplett ignorieren, und mit den restlichen, funktionierenden Angaben arbeiten und alles mitscrollen?

      Du wolltest zwar keine JS-Loesung, aber AFAIK gibt es nur diese: Addiere zum top-Wert des DIVs den jeweils aktuellen document.body.scollTop-Wert, entweder ueber einen Timer oder <body onscroll="...">, wobei letzteres per document.write() geschrieben werden sollte, da onscroll IE-only. ist.

      Mir gehts nicht um die Funktionalität "Fixed", sondern um eine vernünftige Darstellung - im IE eben "absolute", in Browsern, die es besser können, "fixed".

      MfG, Thomas

      BTW: Der IE 5 fuer Mac kennt position: fixed, hat aber Probleme mit Links in diesen Bereichen.

      Das ist dumm, ich hab' leider keinen Mac, auf dem ich das testen könnte. Diese Spezies ist auch nicht unbedingt Zielgruppe. Aber allein aus beruflichen Gründen muß ich mich dafür interessieren.

      PS: Die genannte W3C-Style-Seite rueckelt und roedelt in Mozilla 0.9.7 und diese Navigationsbox wirkt im Kontext merkwuerdig platziert ...

      Naja, toll platziert ist die Box wirklich nicht, und auch ein wenig durchsichtig. Aber sie hat ein paar nette Effekte, vermutlich alle nur mit CSS realisiert. Und da ich mir vorgenommen habe, dieses Jahr mehr mit CSS zu machen...

      - Sven Rautenberg

      1. Hallo Sven,

        Füge ich nur für die Navigation "position:fixed" hinzu, wird die linke Box leicht nach links versetzt. Füge ich diese Angabe auch für die Logo-Box hinzu, wird sie ganz nach links geklatscht, von Positionierung ist nichts mehr zu spüren... und dann siehe erstes Posting: Warum kann der IE nicht einfach "fixed" komplett ignorieren, und mit den restlichen, funktionierenden Angaben arbeiten und alles mitscrollen?

        Das macht er bei mir mit Deinem Problembeispiel, sowohl im IE 5.5 unter W2K also auch im IE 6.0 unter Win98SE.

        Mir gehts nicht um die Funktionalität "Fixed", sondern um eine vernünftige Darstellung - im IE eben "absolute", in Browsern, die es besser können, "fixed".

        Ja, dann ist es doch so ok.

        MfG, Thomas

        1. Mir gehts nicht um die Funktionalität "Fixed", sondern um eine vernünftige Darstellung - im IE eben "absolute", in Browsern, die es besser können, "fixed".

          Ja, dann ist es doch so ok.

          Naja, man kann es "so lassen". Ich hab nicht genug Platz für Screenshots übrig, deshalb hier mal die schematische Darstellung, wie sie bei mir auftritt:

          "normal" (Opera, Mozilla, NS6):

          ++++ ###############
           ++++ ###############
           ++++
           ++++ Content
           ++++ Content
                Content

          IE-"Modus":

          ################
           ################
           ++++
           ++++ Content
           ++++ Content
           ++++ Content
           ++++

          • = Navi-Box

          = Logo-Box

          Verschoben, zusammengekleistert, irgendwie schrecklich. :)

          - Sven Rautenberg

          1. Hallo Sven,

            Verschoben, zusammengekleistert, irgendwie schrecklich. :)

            Diese Feinheiten habe ich gar nicht bemerkt und nur beim gezielten Vergleich zwischen IE 6 und Opera 6 ist mir klar geworden, was Du meinst. Ich halte das fuer absolut vernachlaessigbar, kein IE-User wird das schrecklich finden, hoffe ich ;-).

            MfG, Thomas

            1. Diese Feinheiten habe ich gar nicht bemerkt und nur beim gezielten Vergleich zwischen IE 6 und Opera 6 ist mir klar geworden, was Du meinst.

              Immerhin schön, daß deine IEs und meine IEs wenigstens die gleichen Ansichten über das Layout haben. Ich hatte da schon Bedenken... :)

              Ich halte das fuer absolut vernachlaessigbar, kein IE-User wird das schrecklich finden, hoffe ich ;-).

              Es wird ihnen vermutlich nichts anderes übrigbleiben.

              - Sven Rautenberg

  2. Tatsache, Mozilla 0.97 und Opera 6 kriegens hin... hihi

    1. Tatsache, Mozilla 0.97 und Opera 6 kriegens hin... hihi

      Siehe http://www.styleassistant.de/tips/tip62.htm.

      MfG, Thomas

  3. Keiner sagt das der IE so toll ist weil er alles kann, sondern das e für fast90% der benutzer deiner seite dein tolles feat. nicht sehen können und genau aus diesem punkt stehst du jetzt hier und arbeitest an einer lösung.
    Das würde jeder so machen, aber weniger leute sind bereit für 1-5% marktanteil sich genausoviele gedanken zu machen.

    aus diesem grund ist der ie so gut, weil jeder gewissermaßen gezwungen ist die seite zumindest mit ie funktionieren zu lassen.

    1. Keiner sagt das der IE so toll ist weil er alles kann, sondern das e für fast90% der benutzer deiner seite dein tolles feat. nicht sehen können und genau aus diesem punkt stehst du jetzt hier und arbeitest an einer lösung.

      Ähm, wie lautet obiger Satz ohne Tippfehler? Kann sein, daß der Sinn dadurch etwas auf der Strecke geblieben ist.

      Das würde jeder so machen, aber weniger leute sind bereit für 1-5% marktanteil sich genausoviele gedanken zu machen.

      Du wirst lachen: Der Marktanteil von gut 80% IE-Nutzern ist mir ziemlich egal, wenns um die standardkonforme Umsetzung eines modernen, tabellenlosen Designs mit den Features moderner Browser geht. Es ist nur bezeichnend, daß der IE Version 6, Baujahr 2001, die Seite nur genauso bescheiden hinkriegt, wie Netscape 4, Baujahr 1997, während alle kleinen Entwicklerklitschen bessere Produkte hinkriegen. Aber vermutlich ist die IE-Entwicklungsabteilung durch Bugfixes überlastet.

      aus diesem grund ist der ie so gut, weil jeder gewissermaßen gezwungen ist die seite zumindest mit ie funktionieren zu lassen.

      Der IE ist so gut, weil er simple CSS-Formatierungen nicht kann? Blödsinn. Der IE ist verbreitet, weil er bei Windows mit dabei ist - das macht ihn aber nicht "gut" oder gar "besser" als die anderen. Wäre Netscape 6 dabei, oder Opera, oder Konqueror - alle Welt würde diese Browser benutzen.

      Ansonsten scheinst du mir Tendenzen zum IE-Troll zu haben. Laß das besser. ;)

      - Sven Rautenberg

      1. hi!

        Du wirst lachen: Der Marktanteil von gut 80% IE-Nutzern ist mir
        ziemlich egal, wenns um die standardkonforme Umsetzung eines
        modernen, tabellenlosen Designs mit den Features moderner Browser
        geht. Es ist nur bezeichnend, daß der IE Version 6, Baujahr 2001,
        die Seite nur genauso bescheiden hinkriegt, wie Netscape 4,
        Baujahr 1997, während alle kleinen Entwicklerklitschen bessere
        Produkte hinkriegen.

        Das Problem hatten wir auch bei einer Website. Es ging dabei sogar
        zum Teil um die gleichen CSS-Anweisungen, nämlich um die Eigenschaft
        "fixed". Weil sich die CSS-Probleme -- dem IE CSS-Unterstützung zu
        bescheinigen, ist schon fast eine Frechheit -- nicht in den Griff
        kriegen ließen, haben wir jetzt für Netscape 4.x und alle Versionen
        des Internet Explorers eine abgespeckte Version gemacht.

        Ansonsten scheinst du mir Tendenzen zum IE-Troll zu haben. Laß das
        besser. ;)

        Das merkst du reichlich spät... ;)

        bye, Frank!

      2. Keiner sagt das der IE so toll ist weil er alles kann, sondern das fast90% der benutzer deiner seite dein tolles feat. nicht sehen können und genau aus diesem punkt stehst du jetzt hier und arbeitest an einer lösung.

        so sollte der satz heisen,
        btw habe mir bei jedem 3. posting einen *edit button* gewünscht, aber scheinbar gehört das auch zur erziehungseinrichtung "self", das ich mir meine postings erst nochmal durchlesen muss,.. zum glück hat noch niemand was gesagt das ich immer alles klein schreibe

        Aber vermutlich ist die IE-Entwicklungsabteilung durch Bugfixes überlastet.

        das mag sein...

        aus diesem grund ist der ie so gut, weil jeder gewissermaßen gezwungen ist die seite zumindest mit ie funktionieren zu lassen.

        Der IE ist so gut, weil er simple CSS-Formatierungen nicht kann? Blödsinn. Der IE ist verbreitet, weil er bei Windows mit dabei ist - das macht ihn aber nicht "gut" oder gar "besser" als die anderen. Wäre Netscape 6 dabei, oder Opera, oder Konqueror - alle Welt würde diese Browser benutzen.

        das stimmt auch aber scheinbar ist der sinn des postings nicht ganz rübergekommen, also nochmal ich mag den IE weil es sich kaum einer erlauben kann fehler des IEs in der webseite stehen zu lassen(im gegensatz zu den kleinen browsern)also habe ich als nutzer im endergebniss fehlerfreie seiten vor mir.

        Ansonsten scheinst du mir Tendenzen zum IE-Troll zu haben. Laß das besser. ;)

        nicht das einer auf die idee kommt ich bin ein M$-fan, ich habe nur die angewohnheit den weg zu gehen, der am einfachsten(nicht immer am schnellsten, der  ist eine mischung ausverwendeter zeit, investierten materiellen dingen, arbeit UND wieviel % des zieles erfüllt werden können) zu MEINEN zielen führt.
        und in der browser frage ist erfüllt der IE seine aufgabe nach meinen wünschen.
        so, lassen wir das thema besser dabei bleiben, weil ansichts sache :)

        1. hi!

          Keiner sagt das der IE so toll ist weil er alles kann,
          sondern das fast90% der benutzer deiner seite dein tolles
          feat. nicht sehen können und genau aus diesem punkt stehst
          du jetzt hier und arbeitest an einer lösung.
          so sollte der satz heisen,

          So macht er immer noch keinen Sinn.

          btw habe mir bei jedem 3. posting einen *edit button* gewünscht,

          Wenn jemand nicht weiß, was er sagen will, dann bringt ihm auch eine
          nachträgliche Editierfunktion nichts.

          bye, Frank!

          1. grrr
            also jetzt mal in unkomprimierter form:

            Keiner sagt das der IE so toll ist weil er alles kann,

            ich habe nie gsagt das ich den ie mag weil er eine perfekte technik beinhaltet.

            sondern das fast90% der benutzer deiner seite dein tolles
            feat. nicht sehen können und genau aus diesem punkt stehst
            du jetzt hier und arbeitest an einer lösung.

            Ich mag den IE weil er mir  eigentlich immer fehlerfreie seiten anzeigt.
            Das wiederum liegt daran das der hohe marktanteil des ie webdesigner dazu zwingt ie kompatible seiten zu schreiben. Egal ob sie das wollen oder nicht.

            ok so?...

            1. Hi, RB

              Ich mag den IE weil er mir  eigentlich immer fehlerfreie seiten anzeigt.

              Leider ist es umgekehrt, er zeigt fehlerfreie Seiten fehlerhaft an, dagegen interpretiert er fehlerhafte Seiten 'recht gut'. [1]

              Das wiederum liegt daran das der hohe marktanteil des ie webdesigner dazu zwingt ie kompatible seiten zu schreiben. Egal ob sie das wollen oder nicht.

              Wie gesagt, valide Seiten sind leider nicht unbedingt vollständig IE-kompatibel.

              LG Orlando

              [1] notgedrungen, da Frontpage... ;-)

          2. Hi Frank,

            btw habe mir bei jedem 3. posting einen *edit button* gewünscht,
            Wenn jemand nicht weiß, was er sagen will, dann bringt ihm auch eine
            nachträgliche Editierfunktion nichts.

            Das ist zwar wahr, aber nicht wirklich ein Argument gegen einen "Edit Button" (d. h. eine Preview-Funktion des Forums, die ich mir auch schon lange dringend wünsche, weil das Korrekturlesen eines umfangreichen Postings in dem miniwinzigkeiten Eingabefeld - von Netscape 6.2 bei hoher Bildschirmauflösung - eine ziemliche Qual ist, und bei Netscape 4.5 hier im Büro - mehr darf ich nicht auf dem versiegelten WinNT-Rechner - noch dazu kein automatischer Textumbruch in diesem Eingabefeld erfolgt, wie Du sicherlich weißt).

            Viele Grüße
                  Michael

  4. Hallo Sven,

    wenn Du eine schlaue Lösung ohne großen Aufwand findest, dann
    gib doch mal laut und deutlich bescheid.

    Danke

    Masin

    PS:
    Windows besteht aus folgenden Komponenten zum Arbeiten:
    Editor -> Notepad
    Textverarbeitung -> Wordpad (schon mal Gedanken gemacht um die
    Unterschiede zwischen Textverarbeitung und Textbearbeitung? :))
    Graphikprogramm -> Paint (oder Imaging?)
    HTML-Viewer -> Internet Explorer
    E-Mail -> Outlook Express
    FTP -> FTP
    ... -> ...

    da sollte man mal drüber nachdenken ... ;)