Alexander Königs: Mal wieder Problem mit Internet Explorer

Hallo zusammen!

Ich versuche mich gerade daran, eine Webseite mit CSS zu basteln. Folgendes CSS habe ich mir dafür ausgedacht:

div.main {
  position:absolute;
  top:0px;
  left:130px;
  bottom:30px;
  right:0px;
  overflow:auto;
  z-index:1;
  padding-top:20px;
  padding-left:70px;
  padding-right:20px;
  padding-bottom:20px;
}

div.left {
  position:absolute;
  top:0px;
  left:0px;
  bottom:0px;
  width:90px;
  overflow:hidden;
  z-index:1;
  background-image:url(img/left-background.jpg);
}

div.menu {
  position:absolute;
  top:150px;
  left:30px;
  overflow:hidden;
  z-index:2;
}

div.menu a {
  color:black;
}

div.footer {
  position:absolute;
  left:90px;
  bottom:0px;
  right:0px;
  height:30px;
  overflow:hidden;
  background-color:#FFFFFF;
  z-index:1;
  text-align:right;
  padding-right:10px;
  vertical-align:middle;
  border-top-width:1px;
  border-top-style:dashed;
  border-top-color:gray;
}

Im Firefox sieht das Ganze schonmal wie geplant aus (http://www.alexander-koenigs.de). Ok, das "vertical-align:middle" im Footer läßt er anscheinend aus.

Leider spielt der Internet Explorer überhaupt nicht mit. Er beachtet nichtmal das "text-align:right" im Footer. Kann mir bitte jemand sagen, ob ich was falsch gemacht habe, oder wie ich das Problem lösen kann?

  1. Hi,

    Im Firefox sieht das Ganze schonmal wie geplant aus (http://www.alexander-koenigs.de). Ok, das "vertical-align:middle" im Footer läßt er anscheinend aus.

    natürlich, das Element ist weder vom inline- noch vom table-cell-Typus.

    Leider spielt der Internet Explorer überhaupt nicht mit. Er beachtet nichtmal das "text-align:right" im Footer. Kann mir bitte jemand sagen, ob ich was falsch gemacht habe, oder wie ich das Problem lösen kann?

    Der IE ist nicht in der Lage, bei absoluter Positionierung aus einem left/right- (top/bottom-)Paar die Breite (Höhe) zu berechnen. Er benötigt eine entsprechende Alternativangabe.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hallo,

      natürlich, das Element ist weder vom inline- noch vom table-cell-Typus.

      Ok, vielen Dank.

      Der IE ist nicht in der Lage, bei absoluter Positionierung aus einem left/right- (top/bottom-)Paar die Breite (Höhe) zu berechnen. Er benötigt eine entsprechende Alternativangabe.

      Oh, wie könnte eine solche Alternativangabe aussehen?

      Vielen Dank
      Alexander

      1. Hi,

        Der IE ist nicht in der Lage, bei absoluter Positionierung aus einem left/right- (top/bottom-)Paar die Breite (Höhe) zu berechnen. Er benötigt eine entsprechende Alternativangabe.
        Oh, wie könnte eine solche Alternativangabe aussehen?

        wie gesagt: Der IE beachtet immer nur eine der Angaben, die Breite (Höhe) entnimmt er der width- (height-)Eigenschaft. Unter Berücksichtigung seiner Mängel im Umgang mit denselben, versteht sich.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. wie gesagt: Der IE beachtet immer nur eine der Angaben, die Breite (Höhe) entnimmt er der width- (height-)Eigenschaft. Unter Berücksichtigung seiner Mängel im Umgang mit denselben, versteht sich.

          Das klingt aber übel, weil man ja selber nicht die Breite bzw. Höhe kennt, da diese ja von der Bildschirmauflösung abhängt, oder täusch ich mich da?

          1. Hi,

            Das klingt aber übel, weil man ja selber nicht die Breite bzw. Höhe kennt, da diese ja von der Bildschirmauflösung abhängt, oder täusch ich mich da?

            ja, da täuschst Du Dich - Du könntest kaum falscher liegen. Die Bildschirmauflösung ist bei nichts, was Du tun könntest, auch nur im Ansatz interessant, da sie keinerlei Einfluss auf die Größe des Browserfensters bzw. seiner inneren Ausmaße hat. Es wird in der Regel kleiner, manchmal auch größer sein. Die richtigen Werte für die width- bzw. height-Eigenschaft wirst Du aber nicht kennen, das ist richtig. Hier wirst Du den IE nur mit erheblichem Aufwand versorgen können. Ein Ansatz könnte seine proprietäre expression()-Mechanik sein, welcher aber nur mit aktiviertem Active Scripting funktioniert.

            Cheatah

            --
            X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
            X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
            1. Hi,

              ja, da täuschst Du Dich - Du könntest kaum falscher liegen. Die Bildschirmauflösung ist bei nichts, was Du tun könntest, auch nur im Ansatz interessant, da sie keinerlei Einfluss auf die Größe des Browserfensters bzw. seiner inneren Ausmaße hat. Es wird in der Regel kleiner, manchmal auch größer sein.

              Ja, du hast natürlich recht. Ich persönlich hab meine Fenster immer maximiert, weshalb die Größe des Browserfensters bei mir direkt mit der Auflösung zusammenhängt. Aber natürlich ist das nicht allgemeingültig. Korrekterweise hätte ich also von der Dimension des Browserfensters sprechen müssen.

              Die richtigen Werte für die width- bzw. height-Eigenschaft wirst Du aber nicht kennen, das ist richtig. Hier wirst Du den IE nur mit erheblichem Aufwand versorgen können. Ein Ansatz könnte seine proprietäre expression()-Mechanik sein, welcher aber nur mit aktiviertem Active Scripting funktioniert.

              Um Gottes willen. *seufz*

              Vielen Dank für deine Mühe
              Alexander

            2. Heißa, Cheatah,

              Hier wirst Du den IE nur mit erheblichem Aufwand versorgen können. Ein Ansatz könnte seine proprietäre expression()-Mechanik sein, welcher aber nur mit aktiviertem Active Scripting funktioniert.

              Hui? An welcher Stelle habe ich nicht genau zugehört, die klärt, warum ein einfaches width:100% nicht genügt?

              Caramba!
              Grüße aus Biberach Riss,
              Candid Dauth

              --
              „Bevorzuge Gerechtigkeit auch dann, wenn sie deinen eigenen Nachteil bedeutet.“ | Mein SelfCode
              http://cdauth.de/
              1. Hi,

                Hui? An welcher Stelle habe ich nicht genau zugehört, die klärt, warum ein einfaches width:100% nicht genügt?

                im Ausgangsposting, welches den relevanten[1] CSS-Code enthält.

                Cheatah

                [1] Unter anderem.

                --
                X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
                X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
                X-Will-Answer-Email: No
                X-Please-Search-Archive-First: Absolutely Yes
                1. Heißa, Cheatah,

                  im Ausgangsposting, welches den relevanten[1] CSS-Code enthält.
                  [1] Unter anderem.

                  … weshalb ich ihn mir nicht so genau angesehen hatte.
                  Meinst du wegen des left-Wertes? Naja, notfalls müsste man halt doch den HTML-Code verändern und zwei Elemente verschachteln. Mit dem Quirks-Mode wäre es dann zu bewerkstelligen.

                  Caramba!
                  Grüße aus Biberach Riss,
                  Candid Dauth

                  --
                  „Erwecke niemals bei jemandem dem Eindruck, dass er etwas anders machen solle, weil er es anders macht als du, wenn er es besser macht als du.“ | Mein SelfCode
                  http://cdauth.de/
                  1. Hi,

                    Meinst du wegen des left-Wertes?

                    ja.

                    Naja, notfalls müsste man halt doch den HTML-Code verändern

                    Wegen der derzeit gewünschten Darstellung den HTML-Code verändern? Das hat sich noch nie als vorteilhaft erwiesen.

                    Mit dem Quirks-Mode wäre es dann zu bewerkstelligen.

                    Und im Quirks-Mode zu bleiben noch weniger ...

                    Cheatah

                    --
                    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
                    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
                    X-Will-Answer-Email: No
                    X-Please-Search-Archive-First: Absolutely Yes
                    1. Heißa, Cheatah,

                      Naja, notfalls müsste man halt doch den HTML-Code verändern
                      Wegen der derzeit gewünschten Darstellung den HTML-Code verändern? Das hat sich noch nie als vorteilhaft erwiesen.

                      Deswegen schrieb ich „notfalls“ und „halt doch“. ;-)

                      Mit dem Quirks-Mode wäre es dann zu bewerkstelligen.
                      Und im Quirks-Mode zu bleiben noch weniger ...

                      Ich halte es für durchaus vorteilhaft, den Internet Explorer in den Quirks-Mode zu schicken. Sonst müsste man ja eine Version für moderne Browser, eine für den Internet Explorer 6 und eine für ältere Internet Explorer schreiben. (Übertrieben dargestellt)

                      Da definiere ich doch lieber für mehrere Internet-Explorer-Versionen gleichzeitig.

                      Caramba!
                      Grüße aus Biberach Riss,
                      Candid Dauth

                      --
                      „Zigaretten bei Leuten sorgen dafür, dass es mich nicht mehr interessiert, ob jene Leute Zigaretten besitzen, da mich solche Leute dann nicht mehr interessieren.“ | Mein SelfCode
                      http://cdauth.de/
                      1. Hi,

                        Naja, notfalls müsste man halt doch den HTML-Code verändern
                        Wegen der derzeit gewünschten Darstellung den HTML-Code verändern? Das hat sich noch nie als vorteilhaft erwiesen.
                        Deswegen schrieb ich „notfalls“ und „halt doch“. ;-)

                        soso :-)

                        Ich halte es für durchaus vorteilhaft, den Internet Explorer in den Quirks-Mode zu schicken. Sonst müsste man ja eine Version für moderne Browser, eine für den Internet Explorer 6 und eine für ältere Internet Explorer schreiben. (Übertrieben dargestellt)

                        Das sehe ich anders. Im Standards-Compliance-Mode schreibt man zunächst standardkonformen Code, erweitert ihn dann mit gezielten Hacks um Bugfixes für typische IE-Mängel (aller Versionen mit Fokus auf IE 6), und entscheidet sich anschließend, ob man IE 5.x noch mit Box-Model-Hacks versorgen will oder dort eine defekte Darstellung in Kauf nimmt. Das ist insgesamt _eine_ Version des CSS-Codes, welche über ca. 5-10% unnötigen Code verfügt.

                        Da definiere ich doch lieber für mehrere Internet-Explorer-Versionen gleichzeitig.

                        Das klappt nicht. Die Fehler sind zu unterschiedlich. Der einzige wirklich große Fehler, der hierdurch bei allen bisherigen IEs gleich wird, ist derjenige, der Dir am meisten Mühe macht.

                        Cheatah

                        --
                        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
                        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
                        X-Will-Answer-Email: No
                        X-Please-Search-Archive-First: Absolutely Yes
                        1. Hi,

                          Da definiere ich doch lieber für mehrere Internet-Explorer-Versionen gleichzeitig.

                          Das klappt nicht. Die Fehler sind zu unterschiedlich. Der einzige wirklich große Fehler, der hierdurch bei allen bisherigen IEs gleich wird, ist derjenige, der Dir am meisten Mühe macht.

                          Da habe ich eher gegenteilige Erfahrungen gemacht: der IE6 im standardkompatiblen Modus glänzt durch neue Bugs, die er im Quirks Modus nicht hat. Und - bis auf wenige Ausnahmen - bin ich im Quirks Modus mit gleichen Korrekturen für alle IE-Versionen ausgekommen.

                          Dennoch hat die Nutzung des standardkompatiblen Modus den Vorteil größerer Zukunftssicherheit, wenn die meisten CSS-Hacks nur ältere, nicht mehr weiterentwickelte Versionen betreffen.

                          freundliche Grüße
                          Ingo

  2. Hallo Alexander

    div.main {
      position:absolute;
      ...
    div.left {
      position:absolute;
      ...
    div.menu {
      position:absolute;
    ...
    div.footer {
      position:absolute;

    Ist das wirklich nötig?

    Auf Wiederlesen
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!