Печать двух изображений на двух полных страницах

Я пытаюсь напечатать простую страницу html, содержащую только два изображения. Каждое изображение должно заполнить полную страницу. Мои тестовые изображения имеют точный размер страницы A4 600 dpi.Печать двух изображений на двух полных страницах

Эта страница html печатается со скрытого iframe. В Firefox это работает хорошо, что означает, что у меня есть каждое изображение на каждой странице. Моя проблема на хром ... часть второго изображения на третьей странице по причине ... :(

<html> 
<head><title>DoubleA4</title></head> 
<body> 
    <div style="position: absolute; left: 0; top: 0; bottom: 0; right: 0;"> 
    <img style="width: 100%; height: 100%;" src="http://img15.hostingpics.net/pics/369262front.png"> 
    <img style="width: 100%; height: 100%;" src="http://img15.hostingpics.net/pics/143216back.png"> 
    </div> 
</body> 
</html>

Я думаю, что это проблема CSS, но я не смог найти способ, чтобы получить лучшую визуализацию, чем это

демо-что воспроизвести проблему:.! JSFiddle

заранее спасибо

источник

2016-05-11 Liryna

При отображении изображений и их контейнера в качестве block элементов, и удалить все отступы а также маржи вокруг них, он должен остановить все, что попадает на следующую страницу.

например.

var pages = '<html><head><title>DoubleA4</title></head><body>'; 
pages += '<div style="position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: 0; padding: 0; display: block;">'; 
pages += '<img style="width: 100%; height: 100%; margin: 0; padding: 0; display: block;" src="http://img15.hostingpics.net/pics/369262front.png">'; 
pages += '<img style="width: 100%; height: 100%; margin: 0; padding: 0; display: block;" src="http://img15.hostingpics.net/pics/143216back.png">'; 
pages += '</div></body></html>';

Ваш JSFiddle модифицирована с этими изменениями:

https://jsfiddle.net/0a83ymzz/6/

источник

2016-05-11 16:19:10 DBS

Эта работа отлично! Спасибо ! – Liryna

Печать двух изображений на двух полных страницах

ответ

Смежные вопросы