search

tsayen / dom-to-image

Generates an image from a DOM node using HTML5 canvas
Other
10.21k stars 1.68k forks source link

image.height does not include DOM element margin #432

Open DavidThomas48 opened 1 year ago

DavidThomas48 commented 1 year ago

I am using a copy of dom-to-image.js downloaded recently from github with filesize 27194 dated 10/6/2017 - there's no version info in the file. Using Chrome 104.0.5112.82 on Win10.

I am taking images from, a series of DIVs. I have one DIV that has a CSS margin-top set.

I find that the image.height property equals the DIV's css height property which does not include the margin, but the image does include the top margin area. As a result, the bottom of the div content is not included in the image - the amount missing equals the top margin.

This appears to be a bug whereby the image.height is calculated without including the margin, but then the margin is included in the image. Either the margin should be included in the image.height (preferable), or should be excluded from the image.

Here's a fiddle: https://jsfiddle.net/Nikkorian/yxq82ewt/16/

dom-to-image-bug

AREA-CQK commented 1 year ago

hi you can add overflow: hidden to the outermost element