Menu
I'm doing some styling for a printable brochure on my client's site, which could potentially contain long unordered lists of information.
My issue is when printing in Firefox the entire <UL> will break on to a new page instead of it's children <li>'s splitting, which means it doesn't flow with other content on the page.
I've found the CSS property page-break-inside is only supported in Opera and IE8, does anyone know of an alternative to this property or another method that I can use to prevent the entire list breaking on to a new page.
Cheers!
UPDATE [23.11.2011]: I was able to use a work around on my issue, as the printed document is generated in response to a user's selection so this page is only ever going to be print I (very reluctantly) pushed semantics aside and removed the UL and replaced LI's with DIVs, which break correctly. The question still stands though, for anyone with a similar issue but using the same HTML for print & screen.
I will reproduce the problem I was having and post the necessary HTML & CSS as soon as I can.
874
On the Format menu, select Paragraph, and then select the Line and Page Breaks tab. Clear the Keep lines together, Keep with next, and Page break before check boxes.
Syntax: page-break-inside: auto; avoid: It avoids a page break inside the element.
A page break is a marker in an electronic document that tells the document interpreter that the content which follows is part of a new page. A page break causes a form feed to be sent to the printer during spooling of the document to the printer. Thus it is one of the elements that contributes to pagination.
Consider programmatically removing the UL tags for the print version. You should be able to get the LI elements to display the same with some styling.
JavaScript or even jQuery can handle this easily enough but I bet you could take care of this server side instead.
I know it's not technically valid HTML but sometimes you have to bend the rules when HTML/CSS doesn't offer you flexibility.
151
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
