People,
I designed a web form for my company, whereby it is required that after all info is entered, the form must be printed & signed (the company requires a hand-written signature for this particular form to be submitted.)
The forms began to filter in; & a good many of them have the page clipped off on the right side.
I could realign all my layers further left, squeezing everything within 680 pixels, or so (for 800 X 600 monitor res), but I would rather find a way to insure that the existing design will print full width on all printers, regardless of how the end user has the page margins set in their browser.
I'm told this can be accomplished via Style Sheets. Can someone please point me in the right direction?
Thanks very much,
DesRev1It can't absolutely be corrected with style sheets because a portion of the print formatting is handled by the browser. The best you can do with your page is probably eliminate margins for the print medium. That's because both your CSS and the browser will set printed page margins and my experience has been that the browser will simply chop off the right side of the page when the combined margins and page content is too large.820pxoops... my bad. 640px is safe.I had the same experience yesterday. I wrote a program that prints an HTML page using the browser This html page is formatted by a css page. On my printer it was working fine. Yesterday I installed my program (for testing) on a friend's computer and I was surprised to see the page being chopped off on the right. I thought the priter had stretched the page sidewise, but on returning home I found that the width of the form was almost the same, but the left margin was different.
I did a little experimenting on my browser and found that once you change margins for one page (page setup) that setting remains in the browser for all pages, it is probably written to the registry.
The margins on my browser are currently set to L=0.25in R=0.25 Top=0.25in, bottom=0.46in , curiously if I put anything less than 0.46 for the bottom, it changes it right back to 0.46.
I wonder what the default is for margins in Internet Explorer or if Internet explorer gets these numbers from the installed printer, depending on the printer model.
About solutions:
If we can not control the left margin, maybe we can at least prevent the chopping on the right by setting outer element's width to 100%. That would not look good on the screen, as the user could resize the window to any size he/she wanted, and the form has been designed to look good at a particualr size. I think this could be solved by having two css files, one for the monitor and one for the screen. Also, on the css file for the printer, you could make the left margin=0 or very small. You can let the browser decide on-the-fly which css page to use by putting media="print" or media="screen" in the link tags for the two css pages. (include both in the html page)
Now, all this is a solution I just thought about. I have not tried it yet, and I am not an experienced web programmer. So my solution is not garanteed to work or to be the best solution.
It would be nice to hear from the guys who really know.
But anyway, if I have time today, I'll give it a try and tell you how it works.
Does anybody know what the default margins are for internet explorer (if these defaults are in fact determined by the browser)?When I get stuck on issues like this, I go to A List Apart, heh, they usually have something for what you need. And in this case they do as well - right here (<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/goingtoprint/">http://www.alistapart.com/articles/goingtoprint/</a><!-- m -->). It may not have exactly everything you need, but it lists some good points and does deal with margins if I remember correctly (haven't read it in a while).
I designed a web form for my company, whereby it is required that after all info is entered, the form must be printed & signed (the company requires a hand-written signature for this particular form to be submitted.)
The forms began to filter in; & a good many of them have the page clipped off on the right side.
I could realign all my layers further left, squeezing everything within 680 pixels, or so (for 800 X 600 monitor res), but I would rather find a way to insure that the existing design will print full width on all printers, regardless of how the end user has the page margins set in their browser.
I'm told this can be accomplished via Style Sheets. Can someone please point me in the right direction?
Thanks very much,
DesRev1It can't absolutely be corrected with style sheets because a portion of the print formatting is handled by the browser. The best you can do with your page is probably eliminate margins for the print medium. That's because both your CSS and the browser will set printed page margins and my experience has been that the browser will simply chop off the right side of the page when the combined margins and page content is too large.820pxoops... my bad. 640px is safe.I had the same experience yesterday. I wrote a program that prints an HTML page using the browser This html page is formatted by a css page. On my printer it was working fine. Yesterday I installed my program (for testing) on a friend's computer and I was surprised to see the page being chopped off on the right. I thought the priter had stretched the page sidewise, but on returning home I found that the width of the form was almost the same, but the left margin was different.
I did a little experimenting on my browser and found that once you change margins for one page (page setup) that setting remains in the browser for all pages, it is probably written to the registry.
The margins on my browser are currently set to L=0.25in R=0.25 Top=0.25in, bottom=0.46in , curiously if I put anything less than 0.46 for the bottom, it changes it right back to 0.46.
I wonder what the default is for margins in Internet Explorer or if Internet explorer gets these numbers from the installed printer, depending on the printer model.
About solutions:
If we can not control the left margin, maybe we can at least prevent the chopping on the right by setting outer element's width to 100%. That would not look good on the screen, as the user could resize the window to any size he/she wanted, and the form has been designed to look good at a particualr size. I think this could be solved by having two css files, one for the monitor and one for the screen. Also, on the css file for the printer, you could make the left margin=0 or very small. You can let the browser decide on-the-fly which css page to use by putting media="print" or media="screen" in the link tags for the two css pages. (include both in the html page)
Now, all this is a solution I just thought about. I have not tried it yet, and I am not an experienced web programmer. So my solution is not garanteed to work or to be the best solution.
It would be nice to hear from the guys who really know.
But anyway, if I have time today, I'll give it a try and tell you how it works.
Does anybody know what the default margins are for internet explorer (if these defaults are in fact determined by the browser)?When I get stuck on issues like this, I go to A List Apart, heh, they usually have something for what you need. And in this case they do as well - right here (<!-- m --><a class="postlink" href="http://www.alistapart.com/articles/goingtoprint/">http://www.alistapart.com/articles/goingtoprint/</a><!-- m -->). It may not have exactly everything you need, but it lists some good points and does deal with margins if I remember correctly (haven't read it in a while).