Preparing Documents for Double-Sided Printing - HTML

« Previous Topics
Handling Widows And Orphans
Controlling Page Breaks
Setting Margins With The Margin Property
Next Topics »
Javascript Background
Writing Javascript Code
Using Javascript In Html Documents

To set up pages for printing, you need to account for margin differences on each side of a double-sided, printed page. One way to handle that would be to set the margins differently for elements you expect to appear on different pages, but that would be ugly and almost impossible to do.

The only other way is to use CSS @page pseudo-classes named :left and :right, and to set the margins of each differently. But, once again, the catch is that browser support is not yet there. For the curious among you, these pseudo-classes, working in tandem, look like this:

@page :left { margin-left: .5in; margin-right: .25in; } @page :right { margin-left: .25in; margin-right: .5in; }

You can also specify style for the first page of a document with the :first pseudo-class:

@page { margin: 1in } @page :first { margin-top: 3in }

The preceding code sets all the margins at one inch, but the top margin of the first page at three inches, thus overriding the overall page margins established by the first @page rule.
« Previous Topics
Handling Widows And Orphans
Controlling Page Breaks
Setting Margins With The Margin Property
Next Topics »
Javascript Background
Writing Javascript Code
Using Javascript In Html Documents

List of Tutorials

List of Topics

Interview Questions

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

HTML Topics