Skip to content

Instantly share code, notes, and snippets.

@azuya
Created June 15, 2018 16:11
Show Gist options
  • Save azuya/0f36de4f063444b4dde90db5a6988dfb to your computer and use it in GitHub Desktop.
Save azuya/0f36de4f063444b4dde90db5a6988dfb to your computer and use it in GitHub Desktop.
A4 CSS page template
<page size="A4"></page>
<page size="A4"></page>
<page size="A4" layout="portrait"></page>
<page size="A5"></page>
<page size="A5" layout="portrait"></page>
<page size="A3"></page>
<page size="A3" layout="portrait"></page>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
body {
background: rgb(204,204,204);
}
page {
background: white;
display: block;
margin: 0 auto;
margin-bottom: 0.5cm;
box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);
}
page[size="A4"] {
width: 21cm;
height: 29.7cm;
}
page[size="A4"][layout="portrait"] {
width: 29.7cm;
height: 21cm;
}
page[size="A3"] {
width: 29.7cm;
height: 42cm;
}
page[size="A3"][layout="portrait"] {
width: 42cm;
height: 29.7cm;
}
page[size="A5"] {
width: 14.8cm;
height: 21cm;
}
page[size="A5"][layout="portrait"] {
width: 21cm;
height: 14.8cm;
}
@media print {
body, page {
margin: 0;
box-shadow: 0;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment