<html>
	<head>
    <title>Print Test</title>
    <style type="text/css" media="print">
    @page 
    {
        size:  auto;   /* auto is the initial value */
        margin: 0mm;  /* this affects the margin in the printer settings */
    }

    html
    {
        background-color: #FFFFFF; 
        margin: 0px;  /* this affects the margin on the html before sending to printer */
    }

    body
    {
        border: solid 1px blue ;
        margin: 10mm 15mm 10mm 15mm; /* margin you want for the content */
    }
    </style>
		<!-- <script
			  src="https://code.jquery.com/jquery-2.2.4.min.js"
			  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
			  crossorigin="anonymous"></script> -->
			  <script type="text/javascript">
			  	function printPageArea(areaID){
    var printContent = document.getElementById(areaID).innerHTML;
    var originalContent = document.body.innerHTML;
    document.body.innerHTML = printContent;
    window.print();
    document.body.innerHTML = originalContent;
}
			  </script>

			  
		 <script type="text/javascript">
			$(function() {
				$('#button').on('click',function(){
					window.print();

				});
				// body...
			}); </script> </head> <body> <div id="printableArea"> All the
			printable content goes here... </div> <button type="button"
			name="button" id="button" href="javascript:void
			(0);" onclick="printPageArea
			('printableArea')" >Print</button> <a href="javascript:void
			(0);" onclick="printPageArea('printableArea')">Print</a> 

		<!-- <!DOCTYPE html>
<html lang="en">
<head>
	<title>Print this page example</title>
</head>

<body>
	<h1>Print this page example</h1>
	<p>Lorem </p>
	<button onclick="javascript:window.print();">Print this page</button>

	
</body>
</html> -->

	</body>
	
</html>

