I am trying to print a specific column element from a web page and not print anything else that is displayed on the web page. The column element is centered on the web page and takes up 50% of the width of the web page. I have been able to do this using the following JavaScript code:
function printPageArea(areaID){
var printContent = document.getElementById(areaID).innerHTML;
var originalContent = document.body.innerHTML;
document.body.innerHTML = printContent;
window.print();
document.body.innerHTML = originalContent;
}
The problem I’m having is that the column content (contained as HTML in the printContent
variable) is being printed at 100% of the width of paper. This makes the text very small. Changing the orientation of the printed page from portrait to landscape helps a little, but not what I want.
What I’d like to be able to do is add some code to the JavaScript code above so that I could style the margins and font size of the printContent
content before it is captured. I have tried doing that using document.getElementById(areaID).style = ...
but it only changes the style of the (areadID)
element AFTER the print window is dismissed.
Is it even possible to do what I want? If so, how?