Styles are not properly rendered in iframe because of missing DOCTYPE #459
Comments
|
Hello. Could you please share code to reproduce the print output? A working codesandbox would be ideal. I'm not aware of a missing DOCTYPE being able to impact styles, and if it did then this package would be breaking for everyone that uses it. I'm guessing there is a CSS issue in your code. |
|
The fix for this will be in the next patch release, which will be released this week, possibly even today. Lots of learning from looking into this, thanks for the report. Some references for anyone else reading this: There must be something unique in the styles that is causing the browser to do strange things in quirks mode, since otherwise I would have expected this to have been reported a long time ago. I wasn't able to see anything obvious with a semi-thorough read through the code so it must be some pretty arcane rule in the CSS quirks mode being triggered. Regardless, you are correct that we should be setting the |
…dates (#461) * Read from `clonedContentNodes` instead of `contentNodes`, fix type * README updates * Electron references added to README * Update dependencies * Ensure a `DOCTYPE` is set on the print `iframe` #459 https://stackoverflow.com/questions/14186070/javascript-create-an-iframe-with-strict-doctype * Fix `canvas` elements not printing properly * Remove some debugging statements * Update `devDependencies` to make `npm audit` happy * Properly bind video error handlers
|
Fix published in |
|
@MatthewHerbst Thanks for the quick replies and the fix. |
…dates (#461) * Read from `clonedContentNodes` instead of `contentNodes`, fix type * README updates * Electron references added to README * Update dependencies * Ensure a `DOCTYPE` is set on the print `iframe` MatthewHerbst/react-to-print#459 https://stackoverflow.com/questions/14186070/javascript-create-an-iframe-with-strict-doctype * Fix `canvas` elements not printing properly * Remove some debugging statements * Update `devDependencies` to make `npm audit` happy * Properly bind video error handlers
This is the alignment that is being rendered on the UI.
This is the alignment that is being rendered in the print
Probable cause is that the iframe is missing the
<!DOCTYPE html>Browser: Latest version of Chrome
The text was updated successfully, but these errors were encountered: