Printing div's

[BuzzerTom]

Hi all,

I have a lot of div's with different content each. I have a print button on that page's that prints them all on several pages.

What I want is that a div isn't split over two pages. I don't want on each page only one div, no, I want as many divs as possible on one page, but a div may not start at the bottom on one page and then continue on the top of the next one.

Is this possible with css? Or any other suggestions ?

Greetz,
Tom

 

[BillyRayPreachersSon]

Check out the "page-break-before" print CSS rule:

http://www.w3schools.com/Css/pr_print_pagebb.asp

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[BuzzerTom]

Hi,

Thank you for your answer. I know the page-break-before property, the point is, I can't tell when to use it. Is there a way to place it on a div with an argument so the div isn't divided in two parts? I can manually place the page-break-before in my code, but in that case I will have to know the height of each div and calculate if there is enough space on the page to place the next div or not. Each div has another height because they are dynamicly created from a database.

Greetz
Tom

 

[feherke]

Hi

div [teal]{[/teal]
  [url=http://www.w3.org/TR/2009/CR-CSS2-20090908/page.html#propdef-page-break-inside][blue]page-break-inside[/blue][/url][blue]:[/blue] [green]avoid[/green];
[teal]}[/teal]

Feherke.

http://free.rootshell.be/~feherke/

 

[jstreich]

Print styles to help avoid are nice, but they aren't fool proof... It won't always work, for various reasons.

Moreover, what size paper is user using? What client side CSS do they have in their browser? What assistive technology are they using? You can't control these things (unless you can, if it's a internal app).

Another suggestion, if your breaking more than 2 pages, and it's a normal site (not an application), your content is likely too long. People on the internet don't read, they scan, consider shortening text or breaking into pages on logical bounds.

[plug=shameless]

http://game-master.us/phpx-3.4.0/

[/plug]

 

[BillyRayPreachersSon]

what size paper is user using?

That isn't an issue if you code your print CSS correctly, I've found (percentages instead of px widths).




Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[BuzzerTom]

Thank you all for your answers.

It's for a local intranet aplication, so I have a bit of control over the computers. I tried page-break-inside: avoid; and tested it in both IE7 and IE8, but it doens't work. Any ideas why ?

Greetz,
Buzzer

 

[BillyRayPreachersSon]

Reading this MSDN article, you see this:

This property requires Internet Explorer to be in IE8 mode rendering.

with this example:

<meta http-equiv="X-UA-Compatible" content="IE=8" />

<style type="text/css">
@media print {
    p {
        page-break-inside: avoid;
    }
}
</style>

Are you in IE8 mode?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/