Forum How do I...?

offsetWidth returns undefined.

offsetWidth returns undefined. Does Prince Support offset property? If No, Please suggest me other way to get offsetWidth of an element.
hallvord
Hi Jeffrin, Prince runs JavaScript before the layout calculations are done. This means you can add content to the page through the DOM and it will appears when the page is laid out. Unfortunately, this also means that when the script runs, information about the layout like the width or height of elements is not available.

There is a workaround where you first run Prince once, use JavaScript to collect layout information after the page is laid out, then run Prince again allowing the script to use the information from the previous round.

Look at the scripts attached here for an example of this:
https://www.princexml.com/forum/topic/3516/changebars?p=1#17351

Announcement: repos for tests/utils

hallvord
It may be possible to solve the issue you are running into with CSS instead of JavaScript. If you explain a bit more what you are attempting and share some of your code, I may be able to advice on a solution :)

Announcement: repos for tests/utils

Let me describe what my code does. First my code adds a header section to the page; then it adds a table; If the table width is greater than the header section width, then it sets table width to header section; If the header section is greater than the table width, it verifies if the header section doesn't exceed 575 px and adds header section width. To find header section width, It simply appends them to the page and find width with the offsetWidth property. Is there an alternative way to do this if you can suggest? Please, waiting for your reply!
hallvord
What is the visual effect of, say, "sets table width to header section"? For example, does either table or header have a background colour that needs to cover same width?

It sounds like the rules you try to implement are something like

* TABLE and header should be same width
* TABLE and header width should not exceed 575px

Maybe some variation of

table, .header {
  width: 100%;
  max-width: 575px;
}


would help? Hard to say more without code and a better understanding of the visuals you want :)

Announcement: repos for tests/utils

Edited by hallvord