Geek Answers Handbook

Firefox will not print iframes in display style: none

I use the code from this to print a single page directly from the print button. The user presses the print button, and the URL is sent to the print function. The print function loads a separate page in an iframe display:noneand prints that iframe onLoad. It works in IE, Chrome, but not in firefox. In firefox, it loads a page in a div, but never prints or opens a print dialog. It turns out firefox will not print an iframe if it is set to display:none, as shown below:

<div id="printerDiv" style="display:none"></div>

Is this the expected behavior? All other browsers print, I am thinking of publishing on Bugzilla. I tried some css “tricks” to make the div not displayable where the user can see it, but it always displays somehow. I am currently using the CSS below to make the iframe invisible:

#printerDiv iframe{
width:1px !important;
height:1px !important;
border:0 !important;
margin:0 !important;
}

But margins still exist and leave a 14px space after the generation of the iframe. Is there a way to make an iframe invisible without an attribute at all display:none? Better yet, is there a way to do this without hacking?

I even tried using CSS to set the iframe types on display:block@print media and display:nonefor the screen, the JS function will still not print.

+5
3

iFrame , , .

#printerDiv iframe{
  position: absolute;
  top: -1000px;
}
+5

. display none, Firefox 0 $('#printerDiv').css('height'), $('#printerDiv')[0].style.height outerHeight() outerWidth() .

z-index , position:absolute.

, css:

#printerDiv { z-index: -10; }

, , z-index, jquery css().

+1

If you control the contents of an iframe, do this for printing:

<script type="text/javascript">
window.print()
</script>
0
source

More articles: