Hallo Guest191218,
wenn Du letztlich nur HTML baust um ein PDF zu erstellen, solltest Du uns das Tool nennen mit dem Du HTML in PDF konvertierst, damit man weiß welche Restriktionen gelten.
Dein Problem scheint aus meiner Sicht aber gelöst. Wenn ich dein HTML kopiere und anzeige, sind 3-er Colspans da und die Breiten scheinen okay zu sein.
Der Standardkopf für XHTML5 sieht übrigens so aus:
<?xml version=”1.0” encoding=”UTF-8”?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
Rein formal sind die <?xml ...?> und <!DOCTYPE...> Zeile bei XHTML5 nicht nötig. Dass es XHTML ist, weiß ein Browser an Hand des Content-Type. Dein PDF-Konverter weiß es möglicherweise nicht, deshalb könnte es nützlich sein, sie drin zu lassen.
Ist das handgemachtes HTML oder von einem Generator erzeugt? Wenn Generator, ok, dann ist das so.
Wenn handgemacht:
Deine oncontextmenu/onclick Hölle kannst Du durch Eventbubbling verbessern. Registriere die Eventhandler nur auf dem div_1545386012552 Element, nicht auf jedem einzelnen td. Die click, contextmenu und mousemove Events werden nicht nur auf den Blättern des DOM-Baums signalisiert, sondern wandern danach bis zur Wurzel und können überall behandelt werden. Aber ruf die Eventhandler nicht mit this als Parameter auf, sondern mit event
:
<div id="div_1545386012552" onclick="clicked(event)" ...>
Damit bekommst Du das Event-Objekt, was Du bei Bubbling brauchst. Es hat eine Eigenschaft namens target
, und das ist das Element, auf dem das Event ausgelöst wurde. Auf unobtrusive JavaScript und bessere Event-Registrierung mit addEventListener Funktion gehe ich jetzt nicht ein, du sagst Du bist da ungeübt und das wird zu kompliziert.
Werden die data-Attribute vom PDF-Generator gebraucht? Weil - wenn Du die data-row Attribute auf den <td> nur für dein JavaScript brauchst: nimm sie weg (nur von den td!). Das bläht das HTML auf. Geh im JavaScript lieber her und hol Dir das parentElement des td Node, da steht data-row auch dran.
Rolf
sumpsi - posui - clusi