|
| |
|
|
Starhugger
Posts: 512 Joined: 4/12/2005 Status: offline
|
Page breaks - 12/6/2006 17:14:43
I'm trying to create a printing style sheet for a HTML page. I want it to keep certain lines together. I'm using tables to structure blocks of content. The first row uses THEAD so that it repeats at the top of the page if there's a page break within the table. This does work. The second row uses TBODY and is divided into two columns, with a list of links in the left and a paragraph of text in the right. I want to ensure that I don't wind up with only one line of the TBODY content before a page break. At the moment, that's happening on one of the pages. Here's a sample of the printing CSS I'm using, but most of it doesn't seem to be working:
@media print {
thead td { font-size: 12pt; }
tfoot td { text-align: center; font-size: 9pt; }
thead { display: table-header-group; }
table.indextbl { orphans: 1; }
tfoot { display: table-footer-group; }
thead td, thead td { position: static; }
table.chapter thead { page-break-before: always; }
td.padded p { color: red; orphans: 3; widows: 3; }
} td.padded is the right-hand column (padding on the left side), where the paragraph of text is. Even with widows/orphans set to 3, it still insists on breaking after one line of text. I finally put the color-change in the last line just to see if ANYTHING was getting through. It does indeed change the paragraph text color, but it still leaves the one line on the previous page. I don't think any of the other instructions are working either, which I put in there a while back. (For instance, the footer is not centering.) I thought I needed the other instructions to get the THEAD sections to repeat, but they seem to be doing it anyway by virtue of using THEAD and TBODY. I've tried page-break-before and page-break-after at various places in the table, at various element levels (table, td, p, etc.). I've tried putting the print CSS in a separate file (with media="print" in the style link), as well as putting it in the same CSS that it uses for the screen. Nothing changes where the page breaks. The colour of the text will change, but nothing else seems to have any effect. It's thumbing its nose at me, I swear! I'm testing it on IE7 using the print preview feature. The client's computers use IE6. Has anyone EVER got this to work?? What am I doing wrong? Starhugger ...who's getting a headache
|
|
|
|
Starhugger
Posts: 512 Joined: 4/12/2005 Status: offline
|
RE: Page breaks - 12/6/2006 22:14:35
Also: when I use "page-break-after/before: always" it works! It does weird things with the chunk of text left on the page, but it does break where I put that code. So why can't I get "page-break-after/before: auto" to work? It's supposed to work the same way, if a page break happens within the element, right? SH
|
|
|
|
rubyaim
Posts: 757 Joined: 6/22/2005 Status: offline
|
RE: Page breaks - 12/7/2006 17:50:04
It's not so bad in IE6 really except the right table cells are cutting off (based on my settings and printer and using A4 size paper) - you can try this in your print style to work around that: table#container { table-layout:fixed; width: 99%; } There is a fair bit of white space on print so this could be tweaked a bit. It may be an idea not to print the images - will not help the problem but will save on ink and they are probably not required for a printed document. img {display:none;} You could play around with your td widths for print if the topics are not overly long (eg, make the cell that holds the topics 30%). If it is important that the cells do not break you could perhaps have a PDF alternative (though I'm guessing that defeats the entire purpose?). Edit: AFAIK Opera is the only Browser that supports orphans, widows, page-break-inside and page-break-avoid.
< Message edited by rubyaim -- 12/7/2006 17:59:32 >
_____________________________
Sally
|
|
New Messages |
No New Messages |
Hot Topic w/ New Messages |
Hot Topic w/o New Messages |
Locked w/ New Messages |
Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|