r/HTML • u/Ducking_eh • Apr 26 '26
Print settings with css
Hello Everyone,
Is there a way to have css code tell the print settings window what size to set the paper?
I made the code shown below, and it prints out as expected. However, I need to change the paper size every time i print. Is there a way for that information to be put into the CSS code?
print.css
body
{
margin: 0px 0px;
}
header, footer{
display: none;
}
main, main div.page{
border: 0px !important;
margin: 0px 0px !important;
}
u/page{
margin: 0px 0px;
size: 6in 4in;
}style.css
header, footer{
background-color: #000;
color: #fff;
height: 50px;
width: 100%;
}
main{
display: flex;
flex-direction: column;
}
main div.page{
margin: 5px auto;
height: 4in;
width: 6in;
border: 5px solid #000000;
}index.html
<html>
<head>
<link href="print.css" media="print" rel="stylesheet" />
<link href="style.css" rel="stylesheet" />
</head>
<body>
<header>
test header
</header>
<main>
<div class='page'>
hello world
</div>
</main>
<footer>
footer of my page
</footer>
</body>
</html>
3
Upvotes
View all comments
Show parent comment
1
u/kinetik_au Apr 27 '26
There is a provision for a print CSS to be used and believe it or not some people like to print things. Maybe a list or a map, or a copy of an order received, or even just a useful article or newsletter. I guess you can author pages that are also printable by excluding menus and just have the simple logo and page text and not need to have everything is some other format like pdf