Eiolon Posted August 2, 2012 Share Posted August 2, 2012 I have some CSS code that I can control the Page Setup margins of Internet Explorer and Google Chrome but it will not work in Firefox. Basically I want the margins to be set to 0 instead of what is specified on the browser. Any idea of what I can add to have it work in Firefox? <style type="text/css"> @page { size: auto; /* auto is the initial value */ margin: 0mm; /* this affects the margin in the printer settings */ } body { background-color:#FFFFFF; margin: 0px; } p { margin:0; padding:0; font-family: "Courier New", Courier, monospace; font-size:12px; } </style> Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/ Share on other sites More sharing options...
floridaflatlander Posted August 2, 2012 Share Posted August 2, 2012 I would think that would work, do you/did you use Firefox's fire bug to see if there is something interfering with your styles? Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366192 Share on other sites More sharing options...
Eiolon Posted August 2, 2012 Author Share Posted August 2, 2012 Never heard of Firebug. I just installed it but not exactly sure what I am looking for. I click the CSS panel and it shows the CSS but not sure if there is an indicator I should be looking for if there is a problem? Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366312 Share on other sites More sharing options...
floridaflatlander Posted August 2, 2012 Share Posted August 2, 2012 Open firebug click the html the tab(you'll have html, css, script tabs etc.) then the div tags until you get to the tags in question. Firebug well tell you where the style is coming from, what the css file name is, what line the style is coming from, the inheritance if any and the name of the style. It also color codes the style on the web page so you can see the styles. Also plug your css in here http://jigsaw.w3.org/css-validator/ and your html in here http://validator.w3.org/ and see what they say (you should always do this). Sometimes and extra semicolon, bracket or missing closing html tag can throw things off in one browser but not another. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366319 Share on other sites More sharing options...
Eiolon Posted August 2, 2012 Author Share Posted August 2, 2012 The page is validating fine for both HTML and CSS. This is literally just a page with text on it because it is being sent to a point of sale receipt printer. The only CSS is the code I provided in the original post and that all validated fine. Here is how it looks in the browser: Here is the result when the receipt is printed. So if there is any way to make that margin disappear without having to manually edit the Page Setup in the browser that is what I am looking for. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366326 Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 you have something going on in your site that either chrome is correcting for you, or not correcting for you. if you share a link (on here or in PM) i can take a gander for you. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366368 Share on other sites More sharing options...
Jessica Posted August 2, 2012 Share Posted August 2, 2012 try: html,body{ margin: 0; padding: 0; } Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366372 Share on other sites More sharing options...
Eiolon Posted August 2, 2012 Author Share Posted August 2, 2012 try: html,body{ margin: 0; padding: 0; } Same result, sadly. I have uploaded the page to http://intravising.com/phpfreaks/receipt.php The only thing I did was remove the PHP in the file. The HTML and CSS are untouched. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366380 Share on other sites More sharing options...
Jessica Posted August 2, 2012 Share Posted August 2, 2012 It looks fine in Firefox for me. 14.0.1 Are you saying the problem is only when you print? I don't see the html rule I suggested in your example file. Have you tried doing it without the @page method, and just using body/html? Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366382 Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 http://i.imm.io/yZL4.png Works just fine here. I think you just need to update your FF. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366386 Share on other sites More sharing options...
Eiolon Posted August 2, 2012 Author Share Posted August 2, 2012 I too am using 14.0.1. I only care about the print margin when it is applied to paper. As shown with my above receipts, the margin is only there when printed from Firefox. It is non-existant if I print from IE or Chrome. jesirose - if I remove the @page code, it makes it so the margin is no longer 0 for the printer. I then get the same result as the Firefox receipt. I have removed the @page and tried doing only the html,body tag you suggested and did not fix Firefox but broke IE and Chrome. Mahngiel - you still have the margin visible in your print preview screen. If I look at the print preview in IE and Chrome, the margin is not there, just with Firefox. Keep in mind I have the headers/footers set to empty for all the browsers so I am not sure if that is why you have one. EDIT: I think at this point I will have to control the margins from the browser. I was hoping to avoid doing so that way non-receipts would not be affected. They will just have to live with everything they print to the laserjet being brushed up against the page. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366410 Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 you can't override someone's printer's natural page margins. if my printer is set up to 1" margins, then you only get 6 1/2 of the 8 1/2 inches to work with. That's what you're seeing in my print preview Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366415 Share on other sites More sharing options...
Eiolon Posted August 2, 2012 Author Share Posted August 2, 2012 That is correct. However, using the @page CSS code I was able to have the printer inerpret the margin for where it printed on the paper. For example, in Internet Explorer I set the print margin to be 5 inches all around. However, inserting the @page CSS made it so it printed to the very edge instead of 5 inches into the paper. So while it doesn't change the value found in Page Setup of the browser, it does sent it to the printer without the margin. Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366425 Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 According to Mozilla Developer Network there is no support for these rules in FF. Weird, normally this is an issue with IE... Here are further notes Quote Link to comment https://forums.phpfreaks.com/topic/266579-controlling-margins-in-page-setup-in-firefox/#findComment-1366428 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.