André Laugks: Netscape 6/7, Opera 6 und overflow:auto

Beitrag lesen

Hallo!

Ich habe in einer Tabellenzelle ein div gepackt. Ist der Text "größer" als die Tabellenzelle, soll ein Scrollbalken erscheinen. Das div soll die gesamte Tabellenzelle einnehmen.

.textbereich { overflow:auto;height:100%;margin:0px; }

NN4 ignoriert es und die Tabellenzelle/Tabelle breitet sich komplet aus, also mehr als height=100%. Nun "muß" man die gesamte Seite scrollen. Da kann die Grafikerin und ich sehr gut mit leben. Der Inhalt ist also zugänglich.

In Opera6 wird aber das abgeschnitten, was nicht mehr in die Zelle passt.

Nun dachte ich mir, dem div einfach die Klasse "textbereich" zu setzen, wenn der Browser NN6/7 oder IE ist. Wenn nicht, muß die gesamte Seite gescrollt werden, also alles super.
Im IE funktioniert es auch, aber NN7 weigert sich overflow:auto anzuwenden.

document.getElementById('overflow').setAttribute("class", "textbereich");

Das ich das div ansteuern kann, habe ich über CSS-Eigenschaften getestet.

Es macht eigentlich Sinn das es nicht funktioniert, da die Tabelle mit dem gesamten Text aufgebaut wird und ich dann erst dem div eine Eigenschaft zuweise, bei der die Tabellenzelle/Tabelle kleine sein könnte. Der IE spielt da mit. Ist NN6/7 einfach zu undynamischer?

// Netscape 6 und 7 kein overflow:auto, Scrollbalken für gesamte Seite
// in Opera 6 wird der Text nicht abgeschnitten, gesamte Seite kann gescrollt werden
http://www.kombinat-laugks.de/selfhtml/nn_overflow/index_mit_js.html

// -- Klasse -- wird gesetzt
// Netscape 6 und 7 Sctollbalken nur für Textbereich
// in Opera 6 wird der Text abgeschnitten
http://www.kombinat-laugks.de/selfhtml/nn_overflow/index_ohne_js.html

// -- Klasse -- wird nicht gesetzt
// Tabelle breitet sich auf Browserfenstergröße aus.
<table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr>
 <td colspan="2" height="1%" width="100%"><img src="bilder/layout/0gif.gif" width="1" height="225" alt="" border="0"></td>
</tr>
<tr>
 <td width="1%" height="99%" bgcolor="#999999"><img src="bilder/layout/0gif.gif" width="290" height="300" alt="" border="0"></td>
 <td width="99%" height="99%" valign="top" bgcolor="#cccccc">
<div id="overflow">
[... ganz viel Text ]
</div>
 </td>
</tr>
</table>

Hat jemand ein Lösungsvorschlag?

MfG, André Laugks