views:

32

answers:

1
+1  Q: 

Odd pages in CSS

How do I place a background image to the left in every odd page and to the right in every even page with CSS when printing?

I have searched for quite some time to a solution about this. W3C mentions @page :left but also says that the context can only be used for margins.

Looking through the W3C CSS3 instead of CSS2 I do see somethings that might help (@page :left { @left-middle { content: url(..) }}). But It doesn't seem to work in any of the browsers I tried with namely Safari and FireFox.

+1  A: 

CSS printing is always tricky, especially considering the multitude of ways different browsers handle it.

Have you considered exporting the print stuff to something like pdf format where print handling is much more consistent?

amelvin
We will probably have a PDF version also, but it would be nice to have both. Even nicer if I could do the PDF by using Print->PDF. It will probably be a very big webpage so it would be nice to not require the user have to scroll, find the chapter they are looking for, search for a PDF button, open the PDF and then again scroll to the chapter they want to print.
Daniel W
Perhaps you could have a separate pdf for each chapter and then add a hyperlink to each chapter heading that opens the pdf of that chapter - which would then leave the user to click 'print' within the pdf to get the chapter?
amelvin