size
Quick Summary for size (@page)
Check the Browser compatibility table carefully before using this in production.
Code Usage for size (@page)
/* Keyword values for scalable size */ size: auto; size: portrait; size: landscape; /* <length> values */ /* 1 value: height = width */ size: 6in; /* 2 values: width then height */ size: 4in 6in; /* Keyword values for absolute size */ size: A4; size: B5; size: JIS-B4; size: letter; /* Mixing size and orientation */ size: A4 portrait; More Details for size (@page)
size
Experimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production.
The size CSS at-rule descriptor, used with the @page at-rule, defines the size and orientation of the box which is used to represent a page. Most of the time, this size corresponds to the target size of the printed page if applicable.
Size may either be defined with a "scalable" keyword (in this case the page will fill the available dimensions) or with absolute dimensions.
Syntax
/* Keyword values for scalable size */ size: auto; size: portrait; size: landscape; /* <length> values */ /* 1 value: height = width */ size: 6in; /* 2 values: width then height */ size: 4in 6in; /* Keyword values for absolute size */ size: A4; size: B5; size: JIS-B4; size: letter; /* Mixing size and orientation */ size: A4 portrait; Values
auto The user agent decides the size of the page. In most cases, the dimensions and orientation of the target sheet are used.
landscape The content of the page is displayed in landscape mode (i.e. the longest side of the box is horizontal).
portrait The content of the page is displayed in portrait mode (i.e. the longest side of the box is vertical). This is the default orientation.
<length> Any length value (see <length>). The first value corresponds to the width of the page box and the second one corresponds to its height. If only one value is provided, it is used for both width and height.
<page-size> A keyword which may be any of the following values:
A5This matches the standard, ISO dimensions: 148mm x 210mm.
A4This matches the standard, ISO dimensions: 210mm x 297mm. (most frequently used dimensions for personal printing.)
A3This matches the standard, ISO dimensions: 297mm x 420mm.
B5This matches the standard, ISO dimensions: 176mm x 250mm.
B4This matches the standard, ISO dimensions: 250mm x 353mm.
JIS-B5This correspond to the JIS standard dimensions: 182mm x 257mm.
JIS-B4This correspond to the JIS standard dimensions: 257mm x 364mm.
letterThis keyword is a equivalent to the dimensions of letter paper in North America i.e. 8.5in x 11in.
legalThis keyword is a equivalent to the dimensions of legal papers in North America i.e. 8.5in x 14in.
ledgerThis keyword is a equivalent to the dimensions of ledger pages in North America i.e. 11in x 17in.
Formal definition
| Related at-rule | @page |
|---|---|
| Initial value | auto |
| Computed value | as specified, but with relative lengths converted into absolute lengths |
Formal syntax
<length>{1,2} | auto | [ <page-size> || [ portrait | landscape ] ]where <page-size> = A5 | A4 | A3 | B5 | B4 | JIS-B5 | JIS-B4 | letter | legal | ledger
Examples
Specifying size and orientation
@page { size: 4in 6in landscape; } Nesting inside a @media rule
@media print { @page { size: 50mm 150mm; } } Specifications
| Specification |
|---|
| Proposals for the future of CSS Paged Media # page-size-prop |
Last modified: Aug 12, 2021, by MDN contributors
Add Comment
Other Items in CSS
Related Search Terms
Other Categories in CSS
Random Quote
"Olivia, my eldest daughter, caught measles when she was seven years old. As the illness took its usual course I can remember reading to her often in bed and not feeling particularly alarmed about it. Then one morning, when she was well on the road to recovery, I was sitting on her bed showing her how to fashion little animals out of coloured pipe-cleaners, and when it came to her turn to make one herself, I noticed that her fingers and her mind were not working together and she couldn’t do anything. 'Are you feeling all right?' I asked her. 'I feel all sleepy,' she said. In an hour, she was unconscious. In twelve hours she was dead. The measles had turned into a terrible thing called measles encephalitis and there was nothing the doctors could do to save her. That was...in 1962, but even now, if a child with measles happens to develop the same deadly reaction from measles as Olivia did, there would still be nothing the doctors could do to help her. On the other hand, there is today something that parents can do to make sure that this sort of tragedy does not happen to a child of theirs. They can insist that their child is immunised against measles. ...I dedicated two of my books to Olivia, the first was ‘James and the Giant Peach’. That was when she was still alive. The second was ‘The BFG’, dedicated to her memory after she had died from measles. You will see her name at the beginning of each of these books. And I know how happy she would be if only she could know that her death had helped to save a good deal of illness and death among other children."
I just checked google books for BFG, and the dedication is there.
https://www.google.com.au/books/edition/_/quybcXrFhCIC?hl=en&gbpv=1
Roald Dahl, 1986
