Click to See Complete Forum and Search --> : Printing onto one page


schmidty
10-24-2005, 04:10 PM
Hey guys,

Im trying to print a form that normally takes up over a page and trying to have it print on just one page. Like some printers that have a setting to "shrink to fit". How can I do this using CSS? I know about using @media print....etc. but specifically how can I 'shrink' the page without distorting the layout?

tegraphix
10-24-2005, 04:22 PM
As far as I know, there is no "shrink to fit" with CSS. My suggestion would be to use CSS to change the font and form field properties so that they are small enough to fit on one page.

A lil extra info: http://www.alistapart.com/articles/goingtoprint

schmidty
10-24-2005, 04:39 PM
thanks tegraphix....

another question then =D
is there a way to set the input text fields size equal to its maxlength?
like.... width: ????;

tegraphix
10-24-2005, 04:53 PM
You can change the width of input fields.


input {
width: 100px;
}

schmidty
10-24-2005, 05:04 PM
yeah...im not exactly thinkin straight....I guess what I want to do is, for the printer version, make everything smaller, text, input fields, input text, etc....

tegraphix
10-24-2005, 05:29 PM
Here's an example:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">

body {
color: #000000;
font-size: 9px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

input, textarea {
width: 100px;

/* If you want to change text size in fields */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
}

textarea {
height: 50px;
}

</style>

</head>

<body>

<form>
Name: &nbsp;&nbsp;&nbsp; <input type="text" name="name" id="name" value="My Name">
<br /><br />
Comments: <br />
<textarea>Some text</textarea>
</form>

</body>
</html>

schmidty
10-25-2005, 04:13 PM
thanks tegra...I though I had tried that last night but I must forgot a px or something cause it didnt work.
but I have another question... :)

I am trying to set the print margins with css. I checked out this page (http://www.westciv.com/style_master/academy/css_tutorial/advanced/printing.html) and this is what I did...


@page {
size: landscape;
margin-left: 0.1in;
margin-right: 0.1in;
margin-top: 0.1in;
margin-bottom: 0.1in;
}


...but its not working.
Thanks again for all the help...

tegraphix
10-25-2005, 05:22 PM
for the margins, try using either "px" or "%", not "in", for the measurement

schmidty
10-25-2005, 05:26 PM
tryed px, %, and even cm. could there be something in the head i need?

tegraphix
10-26-2005, 01:27 PM
What exactly isn't working? Does it give you a margin larger than you are specifying or no margin at all?

felgall
10-26-2005, 02:39 PM
in or cm are the most appropriate for margin settings for the print page. Not all browsers understand the @page stylesheet command - try it with a version 8 browser and see if it works there, I don't think any of the version 7 browsers support it.