nicht angemeldet
table height 100% im IE
0 
Struppi
0
table height 100% im IE
Hallo Leute.
Ich habe folgendes Problem.
Ich befinde mich im IE6 im Standard Mode. Ich habe eine Tabelle innerhalb eines DIV. Die Tabelle hat height:100%. Wird nun das Div per JS in der Höhe verändert, so passt sich die Tabelle in ihrer Höhe nicht an. Weder beim verkleinern noch beim vergrößern, obwohl die Höhe relativ angegeben wurde.
Macht man nun einen Resize vom Browser-Fenster in der Breite. So passt die Tabelle wieder. Ein Resize nur in der Höhe hat keine Auswirkung.
Statt der Tabelle in dem Div kann man auch ein Div verwenden. Dieses ändert seine Höhe auch nicht.
Die selbe Seite funktioniert im IE7, FF2 und im IE6 im Quirksmode.
Wie schaffe ich es, das die Tabelle sich in der Höhe anpasst.
Danke im Voraus!
Paul
Quelltext:
<!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="width:100%;margin:0;" >
<head>
<style type="text/css">
.div {
height:400px;
}
.table {
height:100%;
}
</style>
</head>
<body style="width:100%;height:100%;margin:0;position relative;">
<input type="button" value="big" onclick="document.getElementById('my').style.height='500px';">
<input type="button" value="normal" onclick="document.getElementById('my').style.height='400px'">
<input type="button" value="small" onclick="document.getElementById('my').style.height='300px'">
<div class="div" id="my" style="width:100%; border:2px solid red">
<table id="tab" class="table" style="width:100%;" cellpadding="0" cellspacing="0" border="1">
<tr>
<td valign="top">
cell 1
</td>
</tr>
<tr>
<td style="width:100%;">cell2</td>
</tr>
</table>
</div>
</body>
</html>
-
Ich befinde mich im IE6 im Standard Mode. Ich habe eine Tabelle innerhalb eines DIV. Die Tabelle hat height:100%. Wird nun das Div per JS in der Höhe verändert, so passt sich die Tabelle in ihrer Höhe nicht an.
Kann ich nicht nachvollziehen, bei mir tut es das.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> <html> <head> <title> </title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style> #test { position:absolute; width:350px; height:100px; background-color: #090; } #test table { width:100%;height:100%; border:1px solid black; } </style> </head> <body> <div id="test" onclick="this.style.height = ( this.offsetHeight + 5 ) + 'px';"> <table> <tr> <td> XXXXX </td> <td> YYYY </td> <tr> <td> XXXXX </td> <td> YYYY </td> </table> </div> </body> </html>In deinem code muss ein Fehler sein.
Struppi.
--
Javascript ist toll (Perl auch!)-
Ich befinde mich im IE6 im Standard Mode.
Dumm nur, dass ich hier keinen IE & hab, dass hatte ich überlesen.
Struppi.
--
Javascript ist toll (Perl auch!)
-
-
hi,
Wie schaffe ich es, das die Tabelle sich in der Höhe anpasst.
Höhe der Tabelle bei Veränderung der Höhe des Containers per Javascript ebenfalls per Javascript neu setzen?
Wenn eine fixe Höhe in px nicht gewünscht ist - dann vielleicht probieren, Höhe kurzzeitig auf px zu setzen, und dann wieder mit 100% zu überschreiben - vielleicht zwingt das den IE 6 zum neu Rendern.
Holzhammer-Methode, um erneutes Rendern höchstwahrscheinlich zu erzwingen: innerHTML des Containers neu zuweisen.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi wahsaga,
das mit dem Javascript funktioniert zwar, ist allerdings für mich keine Option aufgrund von Laufzeiten. Es muss doch eine Möglichkeit geben dies nur über CSS zu lösen.
Gruß
Paul
-
hi,
das mit dem Javascript funktioniert zwar, ist allerdings für mich keine Option aufgrund von Laufzeiten.
Was für Laufzeiten?
Es muss doch eine Möglichkeit geben dies nur über CSS zu lösen.
Dieses Problem besteht "mit CSS" eigentlich gar nicht - wenn vernünftig implementiert. Du bist hier nur leider auf einen Bug gestossen.
Eine Möglichkeit, den mittels CSS zu beheben sehe ich - sofern du nicht die Formatierung generell ändern willst - nicht (hatte diese Konstellation aber auch noch nicht).
Ursache des Problems dürfte ja wohl sein, dass der IE 6 hier einfach "vergisst", dass er Inhalte neu zu rendern hat. Eine andere Möglichkeit, als ihn durch Änderung gewisser CSS-Eigenschaften per Javascript daran zu erinnern, sehe ich spontan nicht.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
hi wahsaga,
ich sehe mittlerweile auch, dass es ein Bug ist. Für viele gibt es mittlerweile einen Hack.
Das ganze soll in einen WebFramework laufen und da kommen diese Konstellationen öfter vor. Deswegen will ich kein js benutzen um dies zu korrigieren.Gruß
Paul
-
Hi Paul!
Das ganze soll in einen WebFramework laufen und da kommen diese Konstellationen öfter vor. Deswegen will ich kein js benutzen um dies zu korrigieren.
Wieso nicht?
Du musst nur die Zeilendocument.getElementById('tab').style.height='99%'; document.getElementById('tab').style.height='100%';einbinden.
Eventuell brauchst du eine Funktion, die die ID des Elementes entgegennimmt.
Mit diesem Code hat kein (von mir getesteter) Browser Probleme.Natürlich könntest du der Tabelle auch direkt eine Höhe zuweisen.
Ob nun mit Prozent- oder mit Pixelwerten, der IE 6.0 muss gezwungen werden, die Tabelle neu zu rendern.MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)-
Hi Hopsel,
dieser Code würde dann aber nicht bei einem Resize vom Browser-Fenster ausgeführt werden. Damit wäre die Größe des Elementes fest. Diese muss aber relativ bleiben.
Da bräuchte ich schon eine Datenstruktur, die das Resizing dann für all diese Elemente übernimmt und das ist von der LAufzeit her zu teuer.Gruß
Paul
-
-
-
-
-