Breitenangaben werden ignoriert
Raphael
- javascript
Hallo,
ich hab folgendes Problem: Ich möchte eine Tabelle per Javascript anlegen. Diese soll über die gesamte Breite des Anzeigebereichs gehen und in 3 Zellen eingeteilt sein, für die ich die Breite vorgeben möchte:
var tabelle3 = document.createElement("table");
tabelle3.style.width = "100%";
var TR3_0 = tabelle3.insertRow(0);
var TD3_1 = document.createElement("td");
var text1 = document.createTextNode("text1");
TD3_1.appendChild(text1);
TR3_0.appendChild(TD3_1);
TD3_1.style.width = "40%";
var TD3_2 = document.createElement("td");
var text2 = document.createTextNode("text2");
TD3_2.appendChild(text2);
TR3_0.appendChild(TD3_2);
TD3_2.style.width = "40%";
var TD3_3 = document.createElement("td");
var text3 = document.createTextNode("text3");
TD3_3.appendChild(text3);
TR3_0.appendChild(TD3_3);
TD3_3.style.width = "20%";
Das Ergebnis ist eine Tabelle, die über 100% Breite geht, die 1. Zelle ist nur so breit wie sie muss, die 2. Zelle kommt von der Größe her ungefähr hin und die 3. Zelle füllt dann den Rest auf die 100% auf.
Wie kann ich die Zellenbreite fest vorgeben?
(tabelle3.setAttribute("style","table-layout:fixed") funktioniert nicht und tabelle3.style.table-layout = "fixed" ist ein Syntaxfehler)
Schon mal Danke,
Raphael
Hi,
Wie kann ich die Zellenbreite fest vorgeben?
IMHO funktioniert es mit
<colgroup width="100%">
<col width="40%"><col width="20%"><col width="40%">
</colgroup>
besser (aber immer noch nicht perfekt).
Gruß, Cybaer
Hi,
ich hab auf deinen Vorschlag
<colgroup width="100%">
<col width="40%"><col width="20%"><col width="40%">
</colgroup>
hin folgenden Code zwischen anlegen der Tabelle und dem hinzufügen der ersten Zeile eingefügt:
var COL = document.createElement("colgroup");
var breite = document.createAttribute("width");
breite.nodeValue = "100%";
COL.setAttributeNode(breite);
tabelle3.appendChild(COL);
var COL_a = document.createElement("col");
var breite = document.createAttribute("width");
breite.nodeValue = "40%";
COL_a.setAttributeNode(breite);
COL.appendChild(COL_a);
var COL_g = document.createElement("col");
var breite = document.createAttribute("width");
breite.nodeValue = "40%";
COL_g.setAttributeNode(breite);
COL.appendChild(COL_g);
var COL_o = document.createElement("col");
var breite = document.createAttribute("width");
breite.nodeValue = "20%";
COL_o.setAttributeNode(breite);
COL.appendChild(COL_o);
An der Darstellung hat das leider nichts geändert :(
Gruß,
Raphael
Hi,
An der Darstellung hat das leider nichts geändert :(
Und wenn Du es testweise direkt als HTML eingibst?
Wenn das Ergebnis dann anders ist, müßte es am DOM-Code liegen. 8-)
Gruß, Cybaer
Hi,
tut es. Das ist an einer anderen Stelle der Fall: Die Tabelle mit colgroup ist bereits definiert und enthält einige Datensätze. Wenn ich dann dort nur eine Reihe hinzufüge, dann funktioniert alles einwandfrei. Das Problem, dass ich jetzt hab, ist dass die Tabelle gänzlich neu erstellt werden muss, da diese Tabelle nur Teil der Darstellung eines Datensatzes ist (eine geschachtelte Tabelle). So langsam wird der Aufwand dafür echt unangenehm...
Gruß,
Raphael
Hi,
tut es.
D.h., es sieht besser aus? Dann würde ich, so möglich, erstmal die Verwendung von innerHTML empfehlen.
Gruß, Cybaer