[Bug Report]: Full width image looks incorrect in PDF export #2536

New Issue

OVERLORD · 2026-02-05T04:27:05+03:00

OVERLORD commented

2026-02-05 04:27:05 +03:00

Originally created by @Zarik on GitHub (Dec 23, 2021).

Describe the Bug

PDF exported from the demo site https://demo.bookstackapp.com/books/bookstack-demo-site/page/mixed-content-example-page#bkmrk-full-width-image has problems with images

Steps to Reproduce

Go to https://demo.bookstackapp.com/books/bookstack-demo-site/page/mixed-content-example-page#bkmrk-full-width-image
Click Export
Select PDF
Check downloaded PDF

Expected Behaviour

Screenshots or Additional Context

Exact BookStack Version

21.12

PHP Version

No response

Hosting Environment

IDK for demo site: https://demo.bookstackapp.com/

Originally created by @Zarik on GitHub (Dec 23, 2021). ### Describe the Bug PDF exported from the demo site https://demo.bookstackapp.com/books/bookstack-demo-site/page/mixed-content-example-page#bkmrk-full-width-image has problems with images ### Steps to Reproduce 1. Go to https://demo.bookstackapp.com/books/bookstack-demo-site/page/mixed-content-example-page#bkmrk-full-width-image 2. Click Export 3. Select PDF 4. Check downloaded PDF ### Expected Behaviour ![image](https://user-images.githubusercontent.com/5367624/147251932-f2f2bb75-a7c8-44ab-b928-cdbbc4511842.png) ### Screenshots or Additional Context ![image](https://user-images.githubusercontent.com/5367624/147251685-e4958026-9b50-4e9a-83fa-89fd8c750b77.png) ### Exact BookStack Version 21.12 ### PHP Version _No response_ ### Hosting Environment IDK for demo site: https://demo.bookstackapp.com/

OVERLORD added the 🐛 Bug label 2026-02-05 04:27:05 +03:00

OVERLORD closed this issue

2026-02-05 04:27:07 +03:00

OVERLORD commented

2026-02-05 04:27:10 +03:00

@ssddanbrown commented on GitHub (Dec 23, 2021):

Ah, Looks like our PDF image size optimization for our ant user-base leaked into the implementation for human users.

:ant::ant::ant::ant::ant:🐜

Thanks for reporting.

@ssddanbrown commented on GitHub (Dec 23, 2021): Ah, Looks like our PDF image size optimization for our ant user-base leaked into the implementation for human users. :ant::ant::ant::ant::ant::ant: Thanks for reporting.

OVERLORD commented

2026-02-05 04:27:15 +03:00

@ssddanbrown commented on GitHub (Jan 1, 2022):

Now patched, to be part of the next patch release.
Thanks again for reporting!

@ssddanbrown commented on GitHub (Jan 1, 2022): Now patched, to be part of the next patch release. Thanks again for reporting!

OVERLORD commented

2026-02-05 04:27:18 +03:00

@Zarik commented on GitHub (Jan 12, 2022):

Thank you, Dan. Better, unfortunately still looks not right @ssddanbrown

@Zarik commented on GitHub (Jan 12, 2022): Thank you, Dan. Better, unfortunately still looks not right @ssddanbrown ![image](https://user-images.githubusercontent.com/5367624/149024995-44e4c7ad-e0b9-48d7-ba5c-b299d447a727.png)

OVERLORD commented

2026-02-05 04:27:24 +03:00

@ssddanbrown commented on GitHub (Jan 14, 2022):

Ah, okay, Re-opening to check the image output again and to check possibilities.

@ssddanbrown commented on GitHub (Jan 14, 2022): Ah, okay, Re-opening to check the image output again and to check possibilities.

OVERLORD commented

2026-02-05 04:27:29 +03:00

@JoeIzzard commented on GitHub (Jan 14, 2022):

Also ran into a slightly different image issue.

I'm getting this image cut off by the top of the page instead of pushing the content down, and the text next to it should be under it.

This is the full image for reference.

@JoeIzzard commented on GitHub (Jan 14, 2022): Also ran into a slightly different image issue. I'm getting this image cut off by the top of the page instead of pushing the content down, and the text next to it should be under it. ![broken_image](https://user-images.githubusercontent.com/3457283/149550758-bbe228b3-1135-4b4f-9c88-e1f3b5e77e86.png) This is the full image for reference. ![full_image](https://user-images.githubusercontent.com/3457283/149550752-674d7f84-2d65-492f-b55f-717d604dbb1e.png)

OVERLORD commented

2026-02-05 04:27:32 +03:00

@Zarik commented on GitHub (Jan 15, 2022):

Made a research on local environment:

wkhtmltopdf renders image .page-content img { max-width:100% } fine and .page-content a > img { max-width: none; } shows image in original size going out of right page border

dompdf renders tiny images with max-width: 100% and original sized image with max-width: none

both of them will render image correctly if we set max-width: 840px the same as .page-content width

@Zarik commented on GitHub (Jan 15, 2022): Made a research on local environment: **wkhtmltopdf** renders image `.page-content img { max-width:100% }` fine and `.page-content a > img { max-width: none; }` shows image in original size going out of right page border **dompdf** renders tiny images with `max-width: 100%` and original sized image with `max-width: none` both of them will render image correctly if we set `max-width: 840px` the same as `.page-content` width

OVERLORD commented

2026-02-05 04:27:35 +03:00

@JoeIzzard commented on GitHub (Jan 17, 2022):

Using the info @Zarik provided in his last post, I added a correction to our custom header section and found I need to use a much lower max-width to not have the content cut off, which at the very least gets something useable. For reference I have found the following to work quite well:

<style type="text/css">
    .page-content a > img { max-width: 700px; }
</style>

I'm not sure if this is just something weird and that 840px should work or not, I'm not very well versed in PDF Generators I'm afraid.

@JoeIzzard commented on GitHub (Jan 17, 2022): Using the info @Zarik provided in his last post, I added a correction to our custom header section and found I need to use a much lower max-width to not have the content cut off, which at the very least gets something useable. For reference I have found the following to work quite well: ``` <style type="text/css"> .page-content a > img { max-width: 700px; } </style> ``` I'm not sure if this is just something weird and that 840px should work or not, I'm not very well versed in PDF Generators I'm afraid.

OVERLORD commented

2026-02-05 04:27:37 +03:00

@ssddanbrown commented on GitHub (Jan 24, 2022):

Thanks @JoeIzzard & @Zarik for the testing and feedback.
I also found that 700px seemed to be the sweet-spot. Have updated the code in 8b5747eae2, albeit in a way that should not affect WKHTMLTOPDF.

There will be some failing scenarios still, such as when the image is in a smaller container as reported in #3190. From some testing of the master DOMPDF branch it seems like their image sizing will be much better in the next release so we'll really be awaiting those before seeing consistent improvement, May allow us to remove these specific patches.

The tweaks for this have been prepared for v21.12.3 so I'll therefore close this off.

@ssddanbrown commented on GitHub (Jan 24, 2022): Thanks @JoeIzzard & @Zarik for the testing and feedback. I also found that 700px seemed to be the sweet-spot. Have updated the code in 8b5747eae2f5aaeb8c0ac07a4f9e883de8c53470, albeit in a way that should not affect WKHTMLTOPDF. There will be some failing scenarios still, such as when the image is in a smaller container as reported in #3190. From some testing of the `master` DOMPDF branch it seems like their image sizing will be much better in the next release so we'll really be awaiting those before seeing consistent improvement, May allow us to remove these specific patches. The tweaks for this have been prepared for v21.12.3 so I'll therefore close this off.

OVERLORD referenced this issue

2026-02-05 10:22:45 +03:00

[PR #2536] [MERGED] Add Catalan translation #6019

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/BookStack#2536