-
Notifications
You must be signed in to change notification settings - Fork 20
/
page.css
146 lines (119 loc) · 3.38 KB
/
page.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
@charset "UTF-8";
/**
* Provids a basic printable pages layout.
* @see README.md
*
* @author Philipp Miller
* @url https://github.com/philer/HTMLpaper
*
*/
/**************
*** Basics ***
**************/
/* Turn of scrolling for authentic preview */
* {
overflow: visible;
}
/* basic formatting */
html, body {
margin: 0;
padding: 0;
text-align: center;
font-size: 11pt;
font-family: serif;
}
/* turn of print margins, see .page-inner */
@page {
margin: 0;
padding: 0;
}
/* make sure only contents of .page get's printed */
@media print {
.page {
overflow: hidden;
}
}
/* in-browser preview with a nice background */
@media screen {
body {
padding: 20px;
background-color: #222;
}
.page {
margin: 1em;
box-shadow: .75mm .75mm 3mm rgba(0,0,0,.35),
.33mm .33mm 1.5mm rgba(0,0,0,.2);
}
.page-inner {
/*box-shadow: inset 0 0 10px #eee,*/
/*inset 0 0 1px #ccc;*/
}
}
/* basic page formatting */
.page {
width: 210mm;
height: 297mm;
/* width: 793.7007874015749px; /* (210/25.4)*96 */
/* height: 1122.5196850393702px; /* (297/25.4)*96 */
color: black;
background-color: white;
/* This fixes printing in firefox, for some reason */
display: inline-block;
position: relative;
}
/* page content */
.page-inner {
position: absolute;
/*********************
*** PRINT MARGINS ***
*********************
Make adjustments here.
You can use padding as well.
*/
top: 3.5cm;
left: 4cm;
right: 4cm;
bottom: 3.5cm;
text-align: left;
}
/**
* In case you want those.
* If you use LaTeX's pdfpages package,
* you have that handle page numbers instead.
*/
.page-number {
position: absolute;
width: 100%;
bottom: 0;
text-align: center;
}
/*********************
*** Paper Formats ***
*********************/
/*** DIN/ISO formats ***/
/* default, see .page */
.A4page, .A4pages .page { width: 210mm; height: 297mm; }
/* small A* formats */
.A5page, .A5pages .page { width: 148mm; height: 210mm; }
.A6page, .A6pages .page { width: 105mm; height: 148mm; }
.A7page, .A7pages .page { width: 74mm; height: 105mm; }
/* large A* formats */
.A0page, .A0pages .page { width: 841mm; height: 1189mm; }
.A1page, .A1pages .page { width: 594mm; height: 841mm; }
.A2page, .A2pages .page { width: 420mm; height: 594mm; }
.A3page, .A3pages .page { width: 297mm; height: 420mm; }
/* B* formats */
.B0page, .B0pages .page { width: 1000mm; height: 1414mm; }
.B1page, .B1pages .page { width: 707mm; height: 1000mm; }
.B2page, .B2pages .page { width: 500mm; height: 707mm; }
.B3page, .B3pages .page { width: 353mm; height: 500mm; }
.B4page, .B4pages .page { width: 250mm; height: 353mm; }
.B5page, .B5pages .page { width: 176mm; height: 250mm; }
.B6page, .B6pages .page { width: 125mm; height: 176mm; }
.B7page, .B7pages .page { width: 88mm; height: 125mm; }
/* "The U.S., Canada and Mexico use a different system of paper sizes compared to the rest of the world." (https://en.wikipedia.org/wiki/Paper_size) */
.letter-page, .letter-pages .page { width: 8.5in; height: 11.0in; }
.gov-letter-page, .gov-letter-pages .page { width: 8.0in; height: 10.5in; }
.legal-page, .legal-pages .page { width: 8.5in; height: 14.0in; }
.ledger-page, .ledger-pages .page { width: 17in; height: 11in; }
.tabloid-page, .tabloid-pages .page { width: 11in; height: 17in; }