Webstatt.org - Community seit 2006 - 2012 (2024?)

DIV (overflow) Problem

user-307
08.05.2006 08:53

Ich blicke jetzt nicht mehr durch!
Kann mir einer sagen, warum die beiden DIVs in der ersten Zeile korrekt mit Scrollbalken angezeigt werden und die zweite Zeile nur im IE richtig angezeigt wird?!
Im FF (1.5) scrollt er in der zweiten Zeile nicht und in Opera (8.5) zeigt er den Inhalt der DIVs gar nicht an!

<table width="100%" height="100%" border="1">
<tr>
<td height="300"><div style="overflow:auto;width:100%;height:100%">.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/></div></td>
<td height="300"><div style="overflow:auto;width:100%;height:100%">.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/></div></td>
</tr>
<tr>
<td><div style="overflow:auto;width:100%;height:100%">.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/></div></td>
<td><div style="overflow:auto;width:100%;height:100%">.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/>.<br/></div></td>
</tr>
</table>


Falls wer ne Alternative weiß, ich brauche die ersten Zeile auf jeden Fall mit fester Höhe. die zweite soll dann den Rest der Seite füllen. Die DIVs müssen alle scrollbar sein, wenn der Inhalt zu groß wird.

.., Spark
Avatar user-253
08.05.2006 09:16

Vorneweg: der IEX zeigt hier gar nichts richtig an sondern versemmelt die Darstellung durch seinen komischen Quirksmode.... Wenn du einen entsprechenden Doctype setzt wird es gleich angezeigt.

Eine Lösung fällt mir spontan nicht ein (, da ich auch den Sinn nicht sehe).
Ein Workaround wäre auch den unteren Zellen eine feste Höhe zu geben, die naürlich an igrendeine Bildschirmauflösung angepasst wäre.

Avatar user-255
08.05.2006 12:08

Einfach Wahnsinn solcher Code.. da seh ich schon von 10m Entfernung,
dass keine tabulären Daten dargestellt werden,
sondern die Tabelle als Designelement missbraucht wird.

Those who can, do. Those who can't, teach. # Musik gehört dem Volk! # last.fm
user-307
19.05.2006 10:47

Original von user-255
Einfach Wahnsinn solcher Code.. da seh ich schon von 10m Entfernung,
dass keine tabulären Daten dargestellt werden,
sondern die Tabelle als Designelement missbraucht wird.


Ja, ich weiß....
Will mir das auch so langsam ebgewöhnen, aber ich bekomme das leider nicht hin ein Layout mit DIVs in dieser Form zu machen. Hab jetzt schon probiert ohne Ende....

Vielleicht kannst mir da ja helfen.....?

Ich brauche halt eine Kopf und eine Fußzeile mit fester größe. Dazwischen sollen 3 Spalten sein, wovon die links und rechts auch ne feste größe haben.
Das habe ich auch schon hin bekommen. Mein Problem ist nur, dass ich das Ganze in der Höhe nicht auf 100% bekomme :-/

CSS:
#alles {
width: 100%;
height: 100%;
position: relative;
}

#oben {
width: 100%;
height: 140px;
position: relative;
border: 1px solid #000000;
}

#links {
width: 120px;
height: 600px;
position: relative;
left: 0px;
border: 1px solid #000000;
float: left;
}

#rechts {
width: 120px;
height: 600px;
position: relative;
right: 0px;
border: 1px solid #000000;
float: right;
}

#mitte {
width: 100%;
height: 600px;
position: relative;
border: 1px solid #000000;
}

#unten {
width: 100%;
height: 30px;
position: relative;
border: 1px solid #000000;
clear: both;
}


HTML:
<div id="alles">
<div id="oben">oben</div>
<div id="links">links</div>
<div id="rechts">rechts</div>
<div id="mitte">mitte</div>
<div id="unten">unten</div>
</div>

.., Spark
Avatar user-255
19.05.2006 11:57

Stellt sich nur die Frage, was du denn überhaupt darstellen willst.. Normaler Text kann's jedenfalls nicht sein zwinkern

Those who can, do. Those who can't, teach. # Musik gehört dem Volk! # last.fm
user-307
19.05.2006 12:51

So soll es aussehen (bzw. so ist es jetzt).



Als Inhalt wird mit Ajax dann alles mögliche übergeben. Tabellen, Bilder, weiter DIVs....


Aber ich verstehe grade nicht was das mit deiner Frage zu tun hat...
Es ist doch egal was drin dargestellt wird. Oder nich?

.., Spark
Avatar user-255
19.05.2006 13:02

Sieht ja ziemlich vollgestopft aus, und das schon bei 1280px..
Der untere Kasten kann doch am Ende der Seite verschwinden, dann bist du das 100%-Problem los.

Those who can, do. Those who can't, teach. # Musik gehört dem Volk! # last.fm
user-307
19.05.2006 13:06

nee, kann er nich. den brauch ich leider.
geht das etwa nich so wie ich das brauche?

.., Spark
Avatar user-255
19.05.2006 13:16

Könnte so gehen:
body{
margin-bottom:30px;
}
#unten {
height: 30px;
position: fixed;
bottom:0;
z-index:2;
border: 1px solid #000000;
}

Ich persönlich empfinde es als störend, da unten noch nen Kasten zu haben, aus dem mich womöglich noch ne Anzeige anblinkt.. just my 2 cents zwinkern

Those who can, do. Those who can't, teach. # Musik gehört dem Volk! # last.fm