starwarskid: IE 7 - Anzeigefehler bei Tabellen - Darstellung

Hallo!

Hat jemand ne Idee wie ich dem ****** IE 7 sage, dass er die erste von zwei Zeilen einer Tabelle mit fester Größe anzeigen soll und die zweite Zeile sich bis zum Fenster-Boden erstrecken soll?

Hier der Code:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%; padding: 0; margin: 0;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
</head>

<body style="height:100%; padding: 0; margin: 0;">
<table width="200" border="1" style="height: 100%">
  <tr>
    <td style="height: 100px; background-color: #999900;">&nbsp;</td>
    <td>&nbsp;</td>

<td>&nbsp;</td>
  </tr>
  <tr>
    <td style="background-color: #CC0000;">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

Ich denke die beste Lösung wäre wie bei seinem Vorgänger der quirks modus. Deshalb zeigt ie 6 das beispiel ja auch richtig an, sonst müßte man sich sehr wundern :)

Was meint ihr dazu?

  1. Hi,

    Ich denke die beste Lösung wäre wie bei seinem Vorgänger der quirks modus. Deshalb zeigt ie 6 das beispiel ja auch richtig an, sonst müßte man sich sehr wundern :)

    Im Quirksmode geht das, das ist richtig. Von "bester Löung" wollen wir aber doch nicht ernsthaft sprechen?! Oder willst du dich für die Auszeichnung aller weiteren Inhaalte deiner Seite mit dem Quirksmodus rumärgern?

    Außerdem:

    "Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables." (vgl. http://www.w3.org/TR/html401/struct/tables.html).

    Ergo statt Tabellen und Quirksmode: CSS-basierte Layouts

    Gruß
    Antipitch

    1. Hallo Antipitch!

      Oder willst du dich für die Auszeichnung aller weiteren Inhalte deiner Seite mit dem Quirksmodus rumärgern?

      Nein das hatte ich schon hinter mir als ich mich damals mit dem ie 6 rumschlagen musste! Deshalb ist die Programmierung die ich für den IE 7 im quirks verwende die Selbe wie für den IE6 :)

      Ergo statt Tabellen und Quirksmode: CSS-basierte Layouts

      Ja da geb' ich dir Recht aber das Ding ist ja, das ich ohne zusätzliches Scripten nicht die gewollte Umsetzung bekomme wie in meinem Beispiel oben mit Tabellen! Denn ich möchte bei meinen oberen "Kasten" die height in pixeln definieren und nicht in Prozent(!!), der untere Kasten aber soll bis zum Seitboden reichen!

      Es geht nur sowas mit css:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" style="height:100%; padding: 0; margin: 0;">
      <head>
      </head>
      <body style="height:100%; padding: 0; margin: 0;">
      <div style="height: 100%">
      <div style="height: 20%; width: 200px; background-color: #999900;"></div>
      <div style="height: 80%; background-color: #CC0000;"></div>
      </div>
      </body>
      </html>

      Für meine neueren Seiten benutze ich übrigens reines CSS Layout, auch wenn es an einigen Stellen schwächelt. Naja auf version 3 warten :)

      Gruß
       starwarskid

      1. Hi starwarskid,

        Es geht nur sowas mit css:

        ???

        Es geht auch sowas mit css (ohne quirksmode ;-):

        <style type="text/css">
        html, body {
        margin:0;
        padding:0;
        border:0 none;
        height:100%;
        }

        #container {
        width:200px;
        height:100%;
        background-color: #CC0000;
        }

        #top {
        height:100px;
        background-color: #999900;
        }
        </style>

        <div id="container">
          <div id="top">&nbsp;<div>
          <div>&nbsp;</div>
        </div>

        Stellt genau dar, was du haben wolltest (wenn ich dich nicht falsch verstanden habe).

        Gruß
        Antipitch

        1. Nein genau das wollte ich haben :)

          Ich muss mir jetzt nur noch überlegen, wie ich den "unteren teil" beim overflow (wenn Inhalt/Text übers browserfenster ende geht) zum scrollen kriege. Also kein Scrollbalken fürs ganze Fenster (bei NO SCROLL) sondern nur beim "unteren Block" (SCROLL). Meinst du das geht mit reinem CSS, ohne JavaScript?

          -----------------
          Browser Fenster  |
          -----------------
           ---------      N|
          |  Oben   |     O|
          |---------|      |
          |        S|     S|
          |  Unten C|     C|
          |        R|     R|
          |        O|     O|
          |        L|     L|
          |        L|     L|
          ------------------

          gruß
           starwarskid

          1. Hi starwarskid,

            overflow:auto auf das untere div sollte gehen.

            Generell mit Höhen vorsichtig sein, gut testen und im Zweifelsfall (wenn nicht bzw. im ganzen Fenster gescrolled werden soll) eher min-height benutzen (IEs interpretieren das wie height).

            Gruß
            Antipitch

            1. IEs interpretieren das wie height

              ähhm, leichter Kater:

              interpretieren height wie min-height ;-)

              (IE6 kennt min-height auch nicht)

              Gruß
              Antipitch

              1. Ja bei min-height benutz ich für ie 6 childselector hacks :)

                overflow:auto auf das untere div sollte gehen.

                :) das untere div existiert ja nicht wirklich. Ich benutze ja deine variante wo es auf dem Bildschirm nur so aussieht als gäbe es einen unteren "block":

                <div id="container">
                  <div id="top">&nbsp;<div>
                  <div>&nbsp;</div>
                </div>

                Ich denke es geht nicht ohne javascript, das man nur den unteren Bereich/block scrollt, weil man in css die fenstergröße nicht ermitteln kann.

                das mit "nur den unteren blcok scrollen" würde in meiner alten variante mit prozenten gehen, weil ich da einen unteren block mit einer definierten höhe habe, aber das will ich ja nicht weil der obere block dann auch in pixeln ist.

                Oder hast du ne Idee? :)

                Gruß StarwarsKid

                1. aber das will ich ja nicht weil der obere block dann auch in pixeln ist.

                  Ebenfalls leichter Kater:
                  ...weil der obere block dann NICHT in pixeln angegeben sein kann.

                  Es sollte ne edit funktion im forum geben :)

                  1. Grütze .. äh ... Grüße!

                    Es sollte ne edit funktion im forum geben :)

                    Wird es aber nicht :)


                    Kai

                    --
                    What is the difference between Scientology and Microsoft? One is an
                    evil cult bent on world domination and the other was begun by L. Ron
                    Hubbard.
                    ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:|
                    1. Wird es aber nicht :)

                      Danke für die Info, und wie siehts aus mit ner Antwort zum Thema? :)

                2. Yerf!

                  Ich denke es geht nicht ohne javascript, das man nur den unteren Bereich/block scrollt, weil man in css die fenstergröße nicht ermitteln kann.

                  Jein. CSS kann das indirekt mittels absoluter Positionierung und Angabe von top *und* bottom. Leider ist dafür selbst der IE7 noch zu dumm...

                  Aber bevor du komplett auf JS zurückgreifst wäre das eine Überlegung wert, dann müssten sich nur die IE User mit dem Script rumschlagen, bei den anderen gehts auch so.

                  Gruß,

                  Harlequin

                  --
                  <!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->