nicht angemeldet
Klassisches Tabellenlayout in CSS umsetzen
Hallo,
ich quäle mich seit einiger Zeit rum folgenden Code unter IE/Gecko zu meiner Zufriedenheit anhand von Layern und CSS umzusetzen:
<table height="100%" width="100%">
<tr height="100%">
<td>BLUBB</td>
</tr>
<tr>
<td>BLAH</td>
</tr>
</table>
Ich hatte schon ein paar Lösungen, als ich die dann aber mit IE (5.0) probiert hab, hat sich herausgestellt, dass die wohl doch keine waren, obwohl sie mit Gecko einwandfrei angezeigt wurden - die alte Leier eben...
Wäre toll, wenn mir jemand den Schnipsel hier rein schreiben könnte - ich glaub nicht, dass ich das heute noch zu Stande kriege :/
DANKE!
Florian
-
Hallo,
ich quäle mich seit einiger Zeit rum folgenden Code unter »» IE/Gecko zu meiner Zufriedenheit anhand von Layern und CSS »» umzusetzen:
Wie sieht es denn bisher aus?
<table height="100%" width="100%">
<tr height="100%">
<td>BLUBB</td>
</tr>
<tr>
<td>BLAH</td>
</tr>
</table>Ein Div oben, ein Div unten.
Ich hatte schon ein paar Lösungen, als ich die dann aber mit IE (5.0) probiert hab, hat sich herausgestellt, dass die wohl doch keine waren, obwohl sie mit Gecko einwandfrei angezeigt wurden - die alte Leier eben...
Und wo kann man das sehen?
Wäre toll, wenn mir jemand den Schnipsel hier rein schreiben könnte - ich glaub nicht, dass ich das heute noch zu Stande kriege :/
Ein bißchen viel verlangt, oder? Gib uns mal die Chance, deine bisherige Arbeit zu begutachten. Da ist es vielleicht leichter die vorhandene Quelle zu modifizieren, als eine neue Quelle zu erstelen.
Mit freundlichen GrüßenAndré
--
http://forum.de.selfhtml.org/archiv/2003/10/60651/
Und denkt dran - lieber um fünf zuhause als um halb im Zinksarg ...-
Hallo André,
Wie sieht es denn bisher aus?
Naja, alles was ich bisher habe ist dieser Schnipsel und ein paar Vorstellungen im Kopf ;)
Ein Div oben, ein Div unten.
Soweit bin ich auch gewesen.
Hier mein bisheriger Code, der in Mozilla funktioniert:<body style="padding:0;margin:0">
<div style="display:table;border-collapse:collapse;height:100%;width:100%">
<div style="display:table-row">
<div style="display:table-cell">Lorem</div>
</div>
<div style="display:table-row;height:110px">
<div style="display:table-cell">FOOTER</div>
</div>
</div>
</body>Funktioniert im Gecko ident zum Tabellenlayout nur der IE positioniert den 2. Layer nicht am unteren Fensterrand sondern unmittelbar unterhalb des 1. Layers...
Grüße,
Florian-
hi,
Hier mein bisheriger Code, der in Mozilla funktioniert:
<body style="padding:0;margin:0">
<div style="display:table;border-collapse:collapse;height:100%;width:100%">
<div style="display:table-row">
<div style="display:table-cell">Lorem</div>
</div>
<div style="display:table-row;height:110px">
<div style="display:table-cell">FOOTER</div>
</div>
</div>
</body>und diese div-suppe soll semantisch sinnvoller sein, als eine tabelle ...?
Funktioniert im Gecko ident zum Tabellenlayout nur der IE positioniert den 2. Layer nicht am unteren Fensterrand sondern unmittelbar unterhalb des 1. Layers...
dass der IE mit den "table-"-werten für display noch nicht (allzu gut) umgehen kann, ist dir bekannt?
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
Hallo,
und diese div-suppe soll semantisch sinnvoller sein, als eine tabelle ...?
hab ich das jemals behauptet, dass diese Lösung semantisch sinnvoll ist? Darüberhinaus funktioniert sie ja noch nicht mal ;)
dass der IE mit den "table-"-werten für display noch nicht (allzu gut) umgehen kann, ist dir bekannt?
Nein, das war mir nicht bekannt. Wie würdest du es denn lösen?
Grüße,
Florian-
Hallo Florian,
Nein, das war mir nicht bekannt. Wie würdest du es denn lösen?
Ich für meinen Teil schaue mir gern die Seiten der anderen Forumsteilnehmer an und versuche Dinge für meinen Gebrauch zu extrahieren.
Mit freundlichen Grüßen
André
--
http://forum.de.selfhtml.org/archiv/2003/10/60651/
Und denkt dran - lieber um fünf zuhause als um halb im Zinksarg ...-
Hallo André,
Ich für meinen Teil schaue mir gern die Seiten der anderen Forumsteilnehmer an und versuche Dinge für meinen Gebrauch zu extrahieren.
Wie ich bereits geschrieben habe:
alles was ich bisher habe ist dieser Schnipsel und ein paar Vorstellungen im Kopf...Grüße,
Florian-
hi,
Wie ich bereits geschrieben habe:
alles was ich bisher habe ist dieser Schnipsel und ein paar Vorstellungen im Kopf...und Zeromancer schrieb dir gerade, welchen weg er geht, um ein paar mehr vorstellungen in seinen kopf zu bekommen ...
dass du stattdessen nur deine aussage von vorhin wiederholst, ist wenig konstruktiv.
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
Hallo wahsaga,
ob es wohl konstruktiver wäre, die bestehenden paar Zeilen in eine HTML Datei zu packen, hochzuladen und zu verlinken?
Wie soll ich mich denn deiner Meinung nach verhalten, um konstruktiv zu sein? Ich habe mein Problem geschildert, habe meinen nicht zufriedenstellenden Lösungsansatz gepostet und um Hilfe gebeten.
Grüße,
Florian-
hi,
Ich habe mein Problem geschildert, habe meinen nicht zufriedenstellenden Lösungsansatz gepostet und um Hilfe gebeten.
die kann dir so pauschal aber keiner geben.
dass dein ansatz untauglich ist (hauptsächlich wegen des blöden IEs), haben wir ja jetzt festgestellt.
also brauchst du wohl einen anderen - float wäre ein stichwort.
aber mit CSS umzugehen lernt man kaum durch theoretische abhandlungen darüber, sondern durch praktisches ausprobieren und anwenden, nachvollziehen bestehender layouts, etc. - und eben das hatte dir ja auch Zeromancer bereits angeraten.
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."
-
-
-
-
-
-
-
Hallo,
Hallo André,
Wie sieht es denn bisher aus?
Naja, alles was ich bisher habe ist dieser Schnipsel und ein paar Vorstellungen im Kopf ;)
Ein Div oben, ein Div unten.
Soweit bin ich auch gewesen.
Hier mein bisheriger Code, der in Mozilla funktioniert:<body style="padding:0;margin:0">
<div style="display:table;border-collapse:collapse;height:100%;width:100%">
<div style="display:table-row">
<div style="display:table-cell">Lorem</div>
</div>
<div style="display:table-row;height:110px">
<div style="display:table-cell">FOOTER</div>
</div>
</div>
</body>Tja, <td>,<tr> und <table> durch <div> zu ersetzen macht noch kein Layout,...
so long and thanks for the fish,
Andreas Kampitsch
--
SELFCode:ie:% fl:) br:> va:} ls:[ fo:) rl:( n4:# ss:| de:] js:| ch:? sh:( mo:) zu:|-
Hallo,
Tja, <td>,<tr> und <table> durch <div> zu ersetzen macht noch kein Layout,...
Da hast du wohl recht. Noch dazu finde ich es ziemlich dämlich eine Tabelle mit Layern zu emulieren. Deswegen poste ich ja hier um evtl. andere Lösungsstrategien in Erfahrung zu bringen...
Grüße,
Florian
-
-
-
-
ich quäle mich seit einiger Zeit rum folgenden Code unter IE/Gecko zu meiner Zufriedenheit anhand von Layern und CSS umzusetzen:
<table height="100%" width="100%">
<tr height="100%">
<td>BLUBB</td>
</tr>
<tr>
<td>BLAH</td>
</tr>
</table>Keine Ahnung was du hier erreichen willst, aber evtl. suchst du sowas hier:
<h1>BLUBB</h1>
<p>BLAH</p>wozu brauchst du Layer? oder CSS? ich sehe in deinem Quellcode kein Layout.
Struppi.
-
Hallo Struppi,
wozu brauchst du Layer? oder CSS? ich sehe in deinem Quellcode kein Layout.
Ich will, dass BLAH immer am unteren Fensterrand steht, es sei denn dass BLUBB mehr als die ganze Seite in der Höhe ausfüllt - dann soll BLAH direkt nach BLUBB kommen und BLUBB nicht überlagern (wie es mit position:absolute;bottom:0px der Fall wäre...)
Grüße,
Florian-
wozu brauchst du Layer? oder CSS? ich sehe in deinem Quellcode kein Layout.
Ich will, dass BLAH immer am unteren Fensterrand steht, es sei denn dass BLUBB mehr als die ganze Seite in der Höhe ausfüllt - dann soll BLAH direkt nach BLUBB kommen und BLUBB nicht überlagern (wie es mit position:absolute;bottom:0px der Fall wäre...)
Kann sein, dass man das irgendwie hinkriegt.
Es ist aber nicht sinvoll. Unten für ein HTML Dokument ist möglichst dicht vor </body> und mit CSS bottom:0 wobei sich dies aber auf das Dokument bezieht nicht auf den sichtbaren Bereich. Das was du möchtest solltest du mit einem anderen Darstellungsformat durchführen, da es in HTML keine festen Seitengrößen gibt und somit unten immer woanders ist.
Struppi.
-
hi,
Ich will, dass BLAH immer am unteren Fensterrand steht, es sei denn dass BLUBB mehr als die ganze Seite in der Höhe ausfüllt - dann soll BLAH direkt nach BLUBB kommen und BLUBB nicht überlagern (wie es mit position:absolute;bottom:0px der Fall wäre...)
also das klassische "footer"-problem ...
http://www.alistapart.com/articles/footers beschreibt eine möglichkeit, wie man das umsetzen kann.
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."
-
-