XHTML/CSS height:100% - Browserroulette?

Status
Nicht offen für weitere Antworten.
stanleyB

stanleyB

Erfahrenes Mitglied
Hallo,

bin gerade dabei, mein erstes Projekt in XHTML zu starten. Noch nicht mal richtig angefangen, schon ergeben sich die ersten Probleme. Und zwar geht es um ein Tabellenlayout, das ich ueber die komplette Browserfensterhoehe, also 100% aufspannen will. Folgendes Schema:
Code: 
+--------------------+
| 90px               |
+--------------------+
| 100%               |
+--------------------+
| 50px               |
+--------------------+

Das alles in HTML4.0 zusammengestuemmelt und mit CSS formatiert sieht dann folgendermassen aus - http://stanleyb.plasticdreams.de/v2/html.html - funktioniert auch praechtig wie man sieht. Mach ich das ganze jetzt XHtML konform so entsteht aus dem gleichen Code folgendes - http://stanleyb.plasticdreams.de/v2/xhtml.html - Widerlich. Der Browser denkt, er muesse die 2te <tr> auf 100% des Browserfensters dehnen (IE). Der Mozilla Firebird bildet aber das Layout in HTML sowie in XHTML anstandslos identisch ab.
Kann mir jemand ein paar hilfreiche Tipps geben? Ich sitz jetzt schon knappe 4 Stunden ratlos da und expirementiere aber nichts will wirklich funktionieren. Sobald der <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> kommt, verhunzt mir der IE alles. Laut W3C sind beide Files konform. :(

Freu mich ueber jede hilfreiche Antwort...


stanleyB

P.S. Ja, ich weiss, dass Tabellenlayouts langsamer sind als DIVs. Aber die machen das gleiche Problem.
 
Versuch mal statt den "100%" den -> * Stern.
100% des Fensters sind 100% / * nimmt die Größes des Fensters - abzüglich header und footer höhe, das möchtest Du doch erreichen, oder?
 
Hallo Neurodeamon,

ja - genau das will ich erreichen. Nach meinem Wissensstand funktioniert das mit dem * (Stern) aber nur bei Framesets. Hatte das aber auch schon ausprobiert.
Resultat: http://stanleyb.plasticdreams.de/v2/stern.html

Sieht noch seltsamer aus.
// edit: Firebird jedoch, stellt es auch mit der Methode 1A dar. Zum Durchdrehen! :)

stanleyB
 
Zuletzt bearbeitet:
Hallo Stanley,

versuch mal
Code: 
<body>
  <table style="height:100%; border:1px solid black;">
    <tr style="height:100px; background-color:#dfdfdf;">
      <td>100px</td>
    </tr>
    <tr>
      <td>Der Rest</td>
    </tr>
    <tr style="height:50px; background-color:#dfdfdf;">
      <td>50px</td>
    </tr>
  </table>
</body>

bye :)
 
Hallo Andreas,

danke fuer deine Muehe - aber leider das gleiche Phaenomen, wie bei meinem Versuch. Falls sich jetzt irgendjemand da draussen, koestlich ueber diesen Thread amuesiert dann bitte helfen. ;)

Gruesse,
Johannes Distler
 
Ohje , JS - so kompliziert sollte es dann doch nicht werden.
Ich werd mal nochmal versuchen das ganze Teil mit DIVs aufzuspannen, vielleicht klappt das ja besser.

Danke fuer die Tipps,
Johannes Distler
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück