Christian Walgenbach: IE & Mozilla

Hallo,

ich habe ein Problem mit meiner Seite. Ich versuche die Seite http://www.lfzm.de von Frames auf Divs incl. PHP umzustellen.

Leider klappt das noch nicht so ganz. Die neue Seite sieht unter dem Menüpunkt Unser Angebot --> Anatomiekurse unter Mozilla anders aus als im MSIE.

Neue Seite ist zu sehen unter http://www.lfzm.de/testing_php/

Wäre sehr dankbar für einen Tipp.

by Christian

  1. Hallo,

    ich habe ein Problem mit meiner Seite. Ich versuche die Seite http://www.lfzm.de von Frames auf Divs incl. PHP umzustellen.

    Sorry ältere Netscape oder Operas haben echte Probleme mit Divs und halten sich nicht an HTML 4.03. Divs können nur unzuverlässig nebeneinander oder absolut positioniert werden.

    Leider klappt das noch nicht so ganz. Die neue Seite sieht unter dem Menüpunkt Unser Angebot --> Anatomiekurse unter Mozilla anders aus als im MSIE.

    Neue Seite ist zu sehen unter http://www.lfzm.de/testing_php/

    Wäre sehr dankbar für einen Tipp.

    Offenbar lässt sich dein Design mit blinden Tabellen auch gut verwirklichen. Wenn du <colgroup> verwendest, sind die Ladezeiten in Ordnung. Einmal designt und in allen Browsern getestet, können die Inhalte ja durch PHP eingesetzt (include) werden.

    by Christian

    1. Sorry ältere Netscape oder Operas haben echte Probleme mit Divs und halten sich nicht an HTML 4.03. Divs können nur unzuverlässig nebeneinander oder absolut positioniert werden.

      ich verwende Mozilla Firefox

      Offenbar lässt sich dein Design mit blinden Tabellen auch gut verwirklichen. Wenn du <colgroup> verwendest, sind die Ladezeiten in Ordnung. Einmal designt und in allen Browsern getestet, können die Inhalte ja durch PHP eingesetzt (include) werden.

      ich wollte eigentlich divs verwenden. müsste doch eigentlich funktionieren.

    2. Hallo Andre,

      ich habe ein Problem mit meiner Seite. Ich versuche die Seite http://www.lfzm.de von Frames auf Divs incl. PHP umzustellen.
      Sorry ältere Netscape oder Operas haben echte Probleme mit Divs

      Unsinn - ein div ist ein html-Element wie jedes andere auch. Warum sollten Netscapes (welche Version?) und Operas (welche Version?) Probleme damit haben?

      und halten sich nicht an HTML 4.03.

      was ist HTML 4.03?

      Divs können nur unzuverlässig nebeneinander oder absolut positioniert werden.

      Das ist wieder was anderes - jetzt redest du von Positionierung und die hat nichts mit html sondern mit css zu tun - und hier gibt es in Netscape 4 durchaus Probleme.

      Grüße aus Nürnberg
      Tobias

      --
      Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|
  2. Hallo,

    ich habe ein Problem mit meiner Seite. Ich versuche die Seite http://www.lfzm.de von Frames auf Divs incl. PHP umzustellen.

    Wäre sehr dankbar für einen Tipp.

    Wenn du schon umstellst dann doch gleich richtig:

    1. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.lfzm.de%2Ftesting_php%2Funserangebot%2Fanatomiekurse%2Findex.php%3Fmainmenue%3DUnserAngebot%26menue%3DAnatomiekurse

    2. mehr oder weniger schlimme Fehler:

    line 26 column 299 - Warning: <img> lacks "alt" attribute
    line 26 column 451 - Warning: unescaped & or unknown entity "&menue"
    line 26 column 665 - Warning: unescaped & or unknown entity "&menue"
    line 26 column 796 - Warning: <img> lacks "alt" attribute
    line 26 column 945 - Warning: unescaped & or unknown entity "&menue"
    line 26 column 1174 - Warning: unescaped & or unknown entity "&menue"
    line 30 column 101 - Warning: unescaped & or unknown entity "&menue"
    line 30 column 224 - Warning: unescaped & or unknown entity "&menue"
    line 30 column 346 - Warning: unescaped & or unknown entity "&menue"
    line 30 column 460 - Warning: unescaped & or unknown entity "&menue"
    line 30 column 570 - Warning: unescaped & or unknown entity "&menue"
    line 36 column 14 - Warning: <img> lacks "alt" attribute
    line 37 column 42 - Warning: missing </font> before </p>
    line 39 column 20 - Warning: inserting implicit <font>
    line 42 column 4 - Warning: inserting implicit <font>
    line 47 column 4 - Warning: inserting implicit <font>
    line 52 column 4 - Warning: inserting implicit <font>
    line 59 column 4 - Warning: inserting implicit <font>
    line 63 column 9 - Warning: inserting implicit <font>
    line 67 column 9 - Warning: inserting implicit <font>
    line 72 column 9 - Warning: inserting implicit <font>
    line 76 column 9 - Warning: inserting implicit <font>
    line 80 column 9 - Warning: inserting implicit <font>
    line 85 column 9 - Warning: inserting implicit <font>
    line 89 column 9 - Warning: inserting implicit <font>
    line 94 column 4 - Warning: inserting implicit <font>
    line 97 column 19 - Warning: inserting implicit <font>
    line 97 column 66 - Warning: unescaped & or unknown entity "&menue"
    line 99 column 51 - Warning: unescaped & or unknown entity "&menue"
    line 101 column 19 - Warning: inserting implicit <font>
    line 102 column 14 - Warning: <img> lacks "alt" attribute
    line 103 column 42 - Warning: missing </font> before </p>

    Grüße
    Thomas

    1. hallo,

      line 26 column 451 - Warning: unescaped & or unknown

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
      <? $root=$_SERVER["DOCUMENT_ROOT"].'/'; ?><? $serv='/'; ?>
      <html>
      <head>

      <link rel="STYLESHEET" href="<?echo $serv;?>main.css" type="text/css">
      </head>
      <body>

      <div id="logo"><img border="0" src="<?echo $serv;?>bilder/logo.gif" alt="LFZM-Logo" align="left" width="200" height="120"></div>
      <div id="titel"><img border="0" src="<?echo $serv;?>bilder/titel.gif" alt="Titel" width="600" height="100"></div>
      <div id="links"><?php include ($root."menue.php") ?></div>
      <div id="inhalt" align="justify">

      ----

      wenn ich bei $root und $serv das / entferne funktioniert die seite nicht mehr. Meine Seite besteht aus einer obererteil.php und untererteil.php. Der Quelltext oben ist aus dem obererteil.php.

      1. Hallo,

        line 26 column 451 - Warning: unescaped & or unknown

        Das hat nichts mit PHP zu tun, sonder mit solchen Links:

        UnserAngebot&menue=Anatomiekurse

        Das & solltest du entsprechend maskieren als: &  --> UnserAngebot&menue=Anatomiekurse

        (Nach einem & wird in HTML und vom Validator eine Entity erwartet.)

        Grüße
        Thomas

        1. Das & solltest du entsprechend maskieren als: &  --> UnserAngebot&menue=Anatomiekurse

          habe ich schon. leider bringt er immernoch die Fehlermeldung. Im Quelltext scheint es aber korrekt zu sein.

          1. Hallo,

            Das & solltest du entsprechend maskieren als: &  --> UnserAngebot&menue=Anatomiekurse
            habe ich schon. leider bringt er immernoch die Fehlermeldung. Im Quelltext scheint es aber korrekt zu sein.

            "David betete viele Jahre zum Gott, er möge ihn beim Lotto gewinnen lassen. Aber er gewann nie. In seiner großen Enttäuschung rief er einmal laut: 'Lieber Gott, ich bete schon so lange zu dir, warum läßt du mich nicht beim Lotto gewinnen???' und da Antworte ihm eine Stimme aus dem Himmel: 'DAVID, KAUFE DIR ENDLICH EINEN LOTTOSCHEIN!'."

            Und die Moral von der Geschicht'?
            " I was not able to extract a character encoding labeling from any of the valid sources for such information. Without encoding information it is impossible to validate the document. "

            Gib endlich deinem Dokument eine entsprechende <meta>-Angabe zur Encoding!
            (z.B.: <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">)

            Grüße
            Thomas

            1. (z.B.: <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">)

              ok. erledigt

              1. Hallo,

                (z.B.: <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">)
                ok. erledigt

                OK, jetzt kannst du all die Fehler sehen, die nicht deinem DOCTYPE entsprechen. Wenn du beachtest, dass die meisten moderenen Browser einen DOCTYPE-Switch verwenden und je nach verwendete DOCTYPE eine Seite anderes darstellen (sowohl HTML als auch CSS), kannst du nun deine Seite so anpassen, wie für dich nötig ist.

                Grüße
                Thomas

                1. hi,

                  habe jetzt alle Fehler entfernt. Bis auf eine

                  Line 25, column 139: there is no attribute "BORDER" (explain...).
                    ...ptseite.gif" alt="Hauptseite" border="0"></a><a href="/testing_php/unserangeb

                  Was muss ich da tun? Wenn ich border entferne, bekomme ich einen border.

                  by Christian

                  1. Hallo Christian,

                    Line 25, column 139: there is no attribute "BORDER" (explain...).

                    das img-Element kennt in html4.01 strict eben keine Attribut border: http://www.w3.org/TR/html401/struct/objects.html#edef-IMG.

                    ...ptseite.gif" alt="Hauptseite" border="0"></a><a href="/testing_php/unserangeb
                    Was muss ich da tun?

                    das Attribut border entfernen und den Rahmen mit css entfernen (was aber afaik im ns4 nicht funktioniert).

                    Wenn ich border entferne, bekomme ich einen border.

                    der Satz gefällt mir :-)

                    Grüße aus Nürnberg
                    Tobias

                    --
                    Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|
                  2. Hallo,

                    habe jetzt alle Fehler entfernt. Bis auf eine

                    Line 25, column 139: there is no attribute "BORDER" (explain...).
                      ...ptseite.gif" alt="Hauptseite" border="0"></a><a href="/testing_php/unserangeb

                    Was muss ich da tun? Wenn ich border entferne, bekomme ich einen border.

                    Wie Tobias schon sagte, ein:  img { border:none; }  wird dies tun.
                    Ich würde aber empfehlen - falls du nicht zu Ehrgeizig bist ;-) - dass du vielleicht statt die strikte auf die transitionale Variante von HTML zurückgriefst. Auch so kann man standardkonforme Seiten erstellen und damit kommen auch noch die alten Bowowser problemlos klar.

                    Grüße
                    Thomas

                    1. Hallo,
                      vielen Dank für die Hilfe

                      Wie Tobias schon sagte, ein:  img { border:none; }  wird dies tun.

                      die Page ist jetzt laut Valiator sauber.

                      wenn man sich die Page in der Auflösung 1280x1024 in MSIE und dann im Mozilla anschaut sieht man im Mozilla einen weißen Streifen in der Mitte. Was muss ich tun damit es genauso wie im MSIE aussieht?
                      Außerdem: was muss ich bei verschiedenen Auflösungen beachten?

                      Und wie kann ich mein overflow auf die verschiedenen Auflösungen anpassen?

                      Vielen Dank im Voraus.

                      by Christian

                      1. Hallo,

                        vielen Dank für die Hilfe

                        gerne :-)

                        wenn man sich die Page in der Auflösung 1280x1024 in MSIE und dann im Mozilla anschaut sieht man im Mozilla einen weißen Streifen in der Mitte. Was muss ich tun damit es genauso wie im MSIE aussieht?
                        Außerdem: was muss ich bei verschiedenen Auflösungen beachten?

                        Und wie kann ich mein overflow auf die verschiedenen Auflösungen anpassen?

                        Da ich mittlerweile davon weggekommen bin im Vollbildmodus zu surfen, sehe ich statt dem weissen Strifen folgendes (IE auch):
                        http://www.meta-text.net/etc/lfzm1.gif
                        Im Mozilla scollt bei mir zusätzlich die ganze Seite und nicht nur das  <div id="inhalt">.

                        Der Inhalt rutsch in den Browser unter die Navigation weil du
                        #links { position: absolute; } und #inhalt { margin-left:18%; } angegeben hast.

                        Du kannst das so ändern:
                        #links {
                         margin:10px;
                         width:145px;
                         background-color:#FFFFFF;
                         float:left;
                        }

                        #inhalt {
                         overflow:auto;
                         height:79%;
                         padding-right:10px;
                         text-align:justify;
                         background-color: #FFFFFF;
                        }

                        Wenn du allerdings sowohl im IE als auch im Mozilla das gleiche Bild haben willst, muss du dein CSS etwas umbauen (oder für Mozilla für #inhalt eine feste Höhe geben)

                        Grüße
                        Thomas

                        1. Hallo,

                          So habe jetzt noch ein wenig gebasteln. Ich denke ich habe in CSS schon dazugelernt.

                          Jetzt habe ich nur noch das overflow Problem.

                          Ich habe festgestellt, sobald ich im Container inhalt height einfüge, rutscht der Inhalt nach oben, als ob der Top-Wert nicht da wäre.

                          Außerdem wie mache ich das mit den overflow, dass die Scrollleiste bei jeder Auflösung gleich ist?

                          by Christian

                          1. Hallo,

                            Jetzt habe ich nur noch das overflow Problem.

                            Ich weiss (aber wohl nur im Mozilla).

                            Ich habe festgestellt, sobald ich im Container inhalt height einfüge, rutscht der Inhalt nach oben, als ob der Top-Wert nicht da wäre.

                            Außerdem wie mache ich das mit den overflow, dass die Scrollleiste bei jeder Auflösung gleich ist?

                            Die Scrolleite _ist_ bei jeder Auflösung gleich.
                            Die Möglichkeit die ich für dich sehe ist, dass du drei positionierte Bereiche in der Seite hast:

                            1. Logo und Titel
                            2. Navigation
                            3. Inhalt

                            Navigation:
                            top = Höhe vom Logo + ev. Abstand

                            Inhalt:
                            top = Höhe vom Logo + ev. Abstand
                            left = Breite von Navigation + ev. Abstand

                            Dann muss du ein wenig mit den anderen Angabe (width, etc. etc.) experimentieren, aber du muss halt beachten dass die Browser im 'standard compilant mode' das CSS-Boxmodell 'richtig' interpretieren, d.h. sobald du margin oder padding für ein Element definierts, wird das zu inhaltsbreite/höhe (width/height) des Elements addiert.

                            Grüße
                            Thomas