One page output CSS

[earlxph8]

hi guys,

im using this CSS code to create a page like an A4 size paper

.box
{
width:700px;
height:700px;
padding:30px;
border:1px solid black;
margin:1px;
display:table;
}

my problem is:

when i print preview, even if i set settings of printer to reduce and fit, still it makes 2 pages, what script should i make so i can make a fix width and length the same as A4 size paper, i saw some articles that there is no specific pixels that equals to A4 size. but then i just want to make 1 page output.

Thanks.

[tomparker]

Just some basics here, but you are going to want to set up a print style sheet, i.e. print.css. Add it to your html as such:

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

Then as a minimum just for your issue try this:

.box {
width: 100%; margin: 0; float: none;
}

I haven't tested this, but it might get you on the right track. See this article for more info: http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml

[earlxph8]

found answer, and i used this, it helps reduce the space gaps

table {border-collapse:collapse;width:100%;}
p {display:inline;}

from this post:
http://www.daniweb.com/web-development/web-design-html-and-css/threads/445843/remove-space-gap-between-rows