What is a page box in CSS?

You can specify the dimensions, orientation, margins, etc., of a page box within an @page rule. The dimensions of the page box are set with the 'size' property. The dimensions of the page area are the dimensions of the page box minus the margin area.

For example, the following @page rule sets the page box size to 8.5 × 11 inches and creates '2cm' margin on all sides between the page box edge and the page area −

<style>
   <!--
      @page { size:8.5in 11in; margin: 2cm }
   -->
</style>

You can use the margin, margin-top, margin-bottom, margin-left, and margin-right properties within the @page rule to set margins for your page.

Finally, the marks property is used within the @page rule to create crop and registration marks outside the page box on the target sheet. By default, no marks are printed. You may use one or both of the crop and cross keywords to create crop marks and registration marks, respectively, on the target print page.

Lakshmi Srinivas

Published on 27-Apr-2018 11:13:32

• Related Questions & Answers
• What is Box Model in CSS?
• What is a page object in JSP?
• What is a page directive in JSP?
• What is the difference between a white box, black box, and gray box testing?
• CSS Box Shadow
• Role of size property in CSS to set the size and orientation of a page box
• What is Grey Box Testing?
• Create a transparent box with CSS
• CSS @page rule
• What is JSP page redirection?
• CSS padding-box Value
• CSS content-box Value
• CSS Box Sizing Property
• CSS border-box Value
• Understanding CSS Box Model