moritz: Homepage geht über Fensterbreite

Hallo,
programmiere gerade eine Seite, die auf einem Frameset aufbaut, unten die Navigation, oben der anzuzeigende Inhalt. Auf dem Mac funktioniert die Seite mit allen Browsern wunderbar, nur auf dem Windows XP Rechern funktionierts mal wieder nicht. Im Internet Explorer ist die Seite einfach immer ein Stückchen breiter als das Browserfenster, obwohl die Auflösung 1268x1024 ist, und ich die Seite für 1024x768 optimiert habe. Es sollte also eigentlich nichts über den Rand hinausgehen. Das Problem tritt allerdings auch nur bei den Seiten auf, bei denen man nach unten scrollen muss, um alles lesen zu können, bei den anderen ist alles in Ordnung.
Ich habe leider keine Idee mehr, wie ich das Problem beseitigen soll, ist ja doch schon ein ziemliges Designmanko.
Könnt  Ihr mir vielleicht helfen?

Vielen Dank,
moritz

  1. Hi !

    Optimierung für "1024*768" ist nicht wirklich gut, weil nicht alle im Vollbild-Modus browsen und Opera z.B. nochmal extra viel Platz wegnimmt...

    poste doch mal den Link zur Seite, sonst kann man das Problem nicht wirklich erkennen...nur raten (ich rate mal es liegt an diversen Maßangaben und den üblichen IE Bugs *lach)

    MfG
    Micha

    1. poste doch mal den Link zur Seite, sonst kann man das Problem nicht wirklich erkennen...nur raten (ich rate mal es liegt an diversen Maßangaben und den üblichen IE Bugs *lach)

      kann die Seite leider nicht online stellen, da ich noch keinen Webspace habe, kann dir aber mal den Quelltext geben:
      ------------------------------------------
      Frame:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
      <html>
      <head>
      <title>Ärztepraxis-Schenefeld</title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      </head>

      <frameset rows="*,132" cols="*" framespacing="0" frameborder="NO" border="0">
        <frame src="news.htm" name="main">
        <frame src="menu.htm" name="menuFrame" frameborder="no" scrolling="NO" noresize>
      </frameset>
      <noframes><body>
      </body></noframes>
      </html>
      --------------------------------------------

      Seite:
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
      "http://www.w3.org/TR/html4/loose.dtd">
      <html>
      <head>
      <title>Ärztepraxis-Schenefeld - News</title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      <!-- Styles importieren !-->
      <link rel="stylesheet" type="text/css" href="styles.css">
      </head>

      <body>
      <!-- Überschrift !-->
      <center><h1><a name="oben">News</a></h1></center>

      <p>
      <!-- News !-->
      <table width="400" "border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
        <tr>
          <th height="17" background="Bilder/Tabellenleiste-Datum.gif" style="background-repeat:no-repeat;" scope="col"><div align="left">&nbsp;&nbsp;1.5.2004</div></th>
        </tr>
        <tr>
          <td width="600px" height="20" background="Bilder/Tabellenleiste.gif" style="background-repeat:no-repeat;"><div align="left">&nbsp;&nbsp;Homepage aktualisiert
          &nbsp;&nbsp;<a href="#oben"><img src="Bilder/Pfeil-oben.gif" border="0"></a></div></td>
        </tr>
        <tr>
          <td height="100" align="left" valign="top" background="Bilder/verlauf-tabelle.gif">Design und Informationen aktualisiert.<br>
          Außerdem wurden die Ladezeiten optimiert und die Navigation überarbeitet. <a href="News/Homepage1.5.2004.htm" target="newsframe">mehr...</a></td>
        </tr>
      </table>

      <br><br>
      <table width="400" "border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
        <tr>
          <th height="17" background="Bilder/Tabellenleiste-Datum.gif" style="background-repeat:no-repeat;" scope="col"><div align="left">&nbsp;&nbsp;25.4.2004</div></th>
        </tr>
        <tr>
          <td width="600px" height="20" background="Bilder/Tabellenleiste.gif" style="background-repeat:no-repeat;"><div align="left">&nbsp;&nbsp;BLABLA
          &nbsp;&nbsp;<a href="#oben"><img src="Bilder/Pfeil-oben.gif" border="0"></a></div></td>
        </tr>
        <tr>
          <td height="100" align="left" valign="top" background="Bilder/verlauf-tabelle.gif">BALBALBLEEBLEEBALBLABLEELEE.<br>
          TESTTESTESTESTESTESTESTESTESTESTESTESTEST <a href="News/Homepage20-4-04.htm" target="newsframe">mehr...</a></td>
        </tr>
      </table>

      <br><br>
      <table width="400" "border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
        <tr>
          <th height="17" background="Bilder/Tabellenleiste-Datum.gif" style="background-repeat:no-repeat;" scope="col"><div align="left">&nbsp;&nbsp;20.4.2004</div></th>
        </tr>
        <tr>
          <td width="600px" height="20" background="Bilder/Tabellenleiste.gif" style="background-repeat:no-repeat;"><div align="left">&nbsp;&nbsp;BLABLA
          &nbsp;&nbsp;<a href="#oben"><img src="Bilder/Pfeil-oben.gif" border="0"></a></div></td>
        </tr>
        <tr>
          <td height="100" align="left" valign="top" background="Bilder/verlauf-tabelle.gif">BALBALBLEEBLEEBALBLABLEELEE.<br>
          TESTTESTESTESTESTESTESTESTESTESTESTESTEST <a href="News/Homepage20-4-04.htm" target="newsframe">mehr...</a></td>
        </tr>
      </table>

      <br><br>
      <table width="400" "border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
        <tr>
          <th height="17" background="Bilder/Tabellenleiste-Datum.gif" style="background-repeat:no-repeat;" scope="col"><div align="left">&nbsp;&nbsp;15.4.2004</div></th>
        </tr>
        <tr>
          <td width="600px" height="20" background="Bilder/Tabellenleiste.gif" style="background-repeat:no-repeat;"><div align="left">&nbsp;&nbsp;BLABLA
          &nbsp;&nbsp;<a href="#oben"><img src="Bilder/Pfeil-oben.gif" border="0"></a></div></td>
        </tr>
        <tr>
          <td height="100" align="left" valign="top" background="Bilder/verlauf-tabelle.gif">BALBALBLEEBLEEBALBLABLEELEE.<br>
          TESTTESTESTESTESTESTESTESTESTESTESTESTEST <a href="News/Homepage20-4-04.htm" target="newsframe">mehr...</a></td>
        </tr>
      </table>

      <iframe width="450" height="500" style="position:absolute; top:100px; left:450px;" name="newsframe"></iframe>
      </body>
      </html>
      ---------------------------------------

      Hoffe du kannst damit was anfangen

      ach ja: unter Mozilla läufts auch aufm Windoof prima!

      moritz

      1. 100% identifizieren kann ich den Störenfried nicht

        aber es fällt auf, dass du allen ...Haupt-Tabellen keine Höhe zuweist der Inhalt also ohne weiteres den Rahmen "sprengen" kann (und wird), weil die HTML Höhenangaben bei Tabellen nur die minimal-Höhe festlegen, ist der Inhalt größer (z.B. ein Bild) wird die Zelle auch größer...wenn man nicht lenkend eingreift (overflow oder divs mit höhe+overflow)

        nimm dazu, dass IE das Box-Model, also die Größen diverser Elemente, nicht wirklich richtig realisiert

        zum Testen empfehl ich dir, alle Tabellen + Zellen + Zeilen mit dem overflow:hidden Attribut zu versehen (und zur Sicherheit noch divs um die Tabellen mit demselben Attribut + Höhenangabe)

        ausgehend von dem was bei windoof fehlt, weißt du wo der Höhenunterschied liegt

        1. Nachtrag : Box Model Bug

          http://css.maxdesign.com.au/listamatic/about-boxmodel.htm

          oder bei google nach "box model IE" suchen, gibt recht viel dazu

  2. Hallo moritz,

    programmiere gerade eine Seite, die auf einem Frameset aufbaut,
    Im Internet Explorer ist die Seite einfach immer ein Stückchen breiter als das Browserfenster,
    Das Problem tritt allerdings auch nur bei den Seiten auf, bei denen man nach unten scrollen muss, um alles lesen zu können, bei den anderen ist alles in Ordnung.

    Die Symptome klingen für mich schwer nach http://aktuell.de.selfhtml.org/tippstricks/html/scrollbalken/index.htm

    Gruß aus Köln-Ehrenfeld,

    Elya

    --
    "Alle mal an die Nase fassen, und zwar an die eigene": </archiv/2003/9/57903/#m324482>
    _____________
    elyas virtuelle Altbauwohnung: http://www.visuelya.de