{"action":"created","issue":{"url":"https://api.github.com/repos/Kozea/WeasyPrint/issues/732","repository_url":"https://api.github.com/repos/Kozea/WeasyPrint","labels_url":"https://api.github.com/repos/Kozea/WeasyPrint/issues/732/labels{/name}","comments_url":"https://api.github.com/repos/Kozea/WeasyPrint/issues/732/comments","events_url":"https://api.github.com/repos/Kozea/WeasyPrint/issues/732/events","html_url":"https://github.com/Kozea/WeasyPrint/issues/732","id":379199799,"node_id":"MDU6SXNzdWUzNzkxOTk3OTk=","number":732,"title":"`page-break-inside: avoid` breaks @page CSS class","user":{"login":"rohithpr","id":10276811,"node_id":"MDQ6VXNlcjEwMjc2ODEx","avatar_url":"https://avatars2.githubusercontent.com/u/10276811?v=4","gravatar_id":"","url":"https://api.github.com/users/rohithpr","html_url":"https://github.com/rohithpr","followers_url":"https://api.github.com/users/rohithpr/followers","following_url":"https://api.github.com/users/rohithpr/following{/other_user}","gists_url":"https://api.github.com/users/rohithpr/gists{/gist_id}","starred_url":"https://api.github.com/users/rohithpr/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rohithpr/subscriptions","organizations_url":"https://api.github.com/users/rohithpr/orgs","repos_url":"https://api.github.com/users/rohithpr/repos","events_url":"https://api.github.com/users/rohithpr/events{/privacy}","received_events_url":"https://api.github.com/users/rohithpr/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-11-09T15:11:43Z","updated_at":"2018-11-09T15:13:05Z","closed_at":null,"author_association":"NONE","body":"Consider this scenario where there are a number of `<ul>`s inside a `<div class=\"special-footer\">`: \r\n\r\n[div_split_into_two.pdf](https://github.com/Kozea/WeasyPrint/files/2566328/div_split_into_two.pdf)\r\n\r\n\r\nThe first two pages have \"special footer page\" in the footer because of `.special-footer { page: special_footer; }` the third one has \"regular footer page\" in its page.\r\n\r\nHowever, `<ul> 7`  is split across two pages. As per recommendations from various issues in this repo, I added `page-break-inside: avoid;` to the `<ul>` tags. This fixes the issue of the `<ul>` getting split across two pages but causes an issue where the footer is broken.\r\n\r\nI expected the footer on page 2 to still be \"special footer page\" but that's not the case anymore.\r\n\r\n[broken_footer.pdf](https://github.com/Kozea/WeasyPrint/files/2566326/broken_footer.pdf)\r\n\r\nPython code to create these PDFs in comments below.\r\n"},"comment":{"url":"https://api.github.com/repos/Kozea/WeasyPrint/issues/comments/437389113","html_url":"https://github.com/Kozea/WeasyPrint/issues/732#issuecomment-437389113","issue_url":"https://api.github.com/repos/Kozea/WeasyPrint/issues/732","id":437389113,"node_id":"MDEyOklzc3VlQ29tbWVudDQzNzM4OTExMw==","user":{"login":"rohithpr","id":10276811,"node_id":"MDQ6VXNlcjEwMjc2ODEx","avatar_url":"https://avatars2.githubusercontent.com/u/10276811?v=4","gravatar_id":"","url":"https://api.github.com/users/rohithpr","html_url":"https://github.com/rohithpr","followers_url":"https://api.github.com/users/rohithpr/followers","following_url":"https://api.github.com/users/rohithpr/following{/other_user}","gists_url":"https://api.github.com/users/rohithpr/gists{/gist_id}","starred_url":"https://api.github.com/users/rohithpr/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rohithpr/subscriptions","organizations_url":"https://api.github.com/users/rohithpr/orgs","repos_url":"https://api.github.com/users/rohithpr/repos","events_url":"https://api.github.com/users/rohithpr/events{/privacy}","received_events_url":"https://api.github.com/users/rohithpr/received_events","type":"User","site_admin":false},"created_at":"2018-11-09T15:13:05Z","updated_at":"2018-11-09T15:13:05Z","author_association":"NONE","body":"`div_split_into_two.py:`\r\n\r\n```py\r\n#flake8: noqa\r\n\r\nimport weasyprint\r\n\r\ndef generate_pdf():\r\n    content = '''\r\n<html>\r\n    <style>\r\n    @page {\r\n        @bottom-right-corner {\r\n            content: \"regular footer page\";\r\n        }\r\n    }\r\n\r\n    .special-footer { page: special_footer; }\r\n    @page special_footer {\r\n        @bottom-right-corner {\r\n            content: \"special footer page\";\r\n        }\r\n    }\r\n\r\n    </style>\r\n    <body>\r\n        <div class=\"special-footer\" style=\"border: 1px solid blue;\">\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n            </ul>\r\n        </div>\r\n        <div style=\"page-break-before: always;\">\r\n            <ul style=\"border: 1px solid red;\">\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n            </ul>\r\n        </div>\r\n    </body>\r\n</html>\r\n'''\r\n\r\n    # import pudb; pudb.set_trace()\r\n    html = weasyprint.HTML(string=content)\r\n    html.write_pdf('test_doc.pdf')\r\n\r\nif __name__ == '__main__':\r\n    generate_pdf()\r\n```\r\n\r\n`broken_footer.py`:\r\n\r\n```py\r\n#flake8: noqa\r\n\r\nimport weasyprint\r\n\r\ndef generate_pdf():\r\n    content = '''\r\n<html>\r\n    <style>\r\n    @page {\r\n        @bottom-right-corner {\r\n            content: \"regular footer page\";\r\n        }\r\n    }\r\n\r\n    .special-footer { page: special_footer; }\r\n    @page special_footer {\r\n        @bottom-right-corner {\r\n            content: \"special footer page\";\r\n        }\r\n    }\r\n\r\n    </style>\r\n    <body>\r\n        <div class=\"special-footer\" style=\"border: 1px solid blue;\">\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n                <li>hello 1</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n                <li>hello 2</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n                <li>hello 3</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n                <li>hello 4</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n                <li>hello 5</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n                <li>hello 6</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n                <li>hello 7</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n                <li>hello 8</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n                <li>hello 9</li>\r\n            </ul>\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n                <li>hello 10</li>\r\n            </ul>\r\n        </div>\r\n        <div style=\"page-break-before: always;\">\r\n            <ul style=\"border: 1px solid red; page-break-inside: avoid;\">\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n                <li>hello regular footer</li>\r\n            </ul>\r\n        </div>\r\n    </body>\r\n</html>\r\n'''\r\n\r\n    # import pudb; pudb.set_trace()\r\n    html = weasyprint.HTML(string=content)\r\n    html.write_pdf('test_doc.pdf')\r\n\r\nif __name__ == '__main__':\r\n    generate_pdf()\r\n```"}}
{"actor":{"display_login":"rohithpr"}}