Home » Javascript » How to print div in landscape mode in angularjs

How to print div in landscape mode in angularjs

Posted by: admin August 19, 2018 Leave a comment

Questions:

I have a table with some datas. In my screen its in correct format, but i want on click of print button, it should print the div in landscape mode.

jsfiddle

In this example, if I click print it will print the page exactly what it is. But i want to print in landscape. Can anyone please tell me how to do this?

<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<title>Form</title>
</head>
<body>
<center>
<div id="printable" align="center">
<font face="algerian, sans-serif" size="+2">AROPOLIS INSUARANCE BROKERS LTD. </font><br><font size="-1">
2<sup>nd</sup> Floor, Shamneel Court, Parklands Road, Nairobi, Kenya. <br>
P.O. Box 1157, Sarit Centre, Post Offive, Nairobi 00606, Kenya. <br>
Telephones 020 - 4444746 / 7 / 8, Fax 020 - 4444745. Email [email protected]</font>
</div>
</center>
<p>
<style>
body{
-webkit-print-color-adjust:exact;
}
</style>
<style type="text/css">
#printable { display: none; }
@media print
{
#non-printable { display: none; }
#printable { display: block; }
}
</style>
<style>
.break { page-break-before: always; }
</style>
<style>
@page {
size: a4 portrait;
margin: 0;
padding: 0;
margin-top: 20mm;
}
</style>
<style>
.rotate {
/* Safari */
-webkit-transform: rotate(90deg);
/* Firefox */
-moz-transform: rotate(90deg);
/* IE */
-ms-transform: rotate(90deg);
/* Opera */
-o-transform: rotate(90deg);
/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
</style>
</p>
<center>
<table width="782"  border="1" style="border-collapse:collapse;">
<tr>
<td width="702"><div align="center"><strong>CLAIM FORM FOR PROPERTY DAMAGE OR LOSS.</strong></div>
Applicable to Fire, Special Perils, Home Covers, Theft, All-Risks, Money, Baggage and Glass. The issue of this form is not an admission of liability on the part of the company. All questions must be answered in full.
</td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td width="468"><p>Name of Insurer:  
</p></td>
<td width="300"><p>Type of Cover:  
</td>
</tr></table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td width="267">Policy <br/>Number:  <input type="text" class="input" size="30"></td>
<td width="263">Renewal<br/>date: <br/></td>
<td width="230"><p>Last premium <br/>
date paid on: </p></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td class="hdr"><font color="#FFFFFF" style="border-collapse:collapse;">INSURED</font></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td>Name: <?php echo $firstname; ?> <?php echo $middlename; ?> <?php echo $lastname; ?></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td>Occupation / Profession: <?php echo $occupation; ?></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td>Address: <?php echo $physadd; ?></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td>Telephone: <?php echo $mobileno; ?></td>
<td>Fax/Email: <?php echo $email; ?></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td class="hdr"><font color="#FFFFFF" >CIRCUMSTANCES GIVING RISE TO A CLAIM</font></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td width="267">Date of <br/>Loss </td>
<td width="263">Time of <br/>Loss </td>
<td width="230"><p>When/Who discovered <br/>the loss or damage 
</p></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td height="1" style="border-collapse:collapse;"><p>Describe fully how the loss or damage occured
</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td class="hdr"><font color="#FFFFFF">GENERAL INFORMATION</font></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td>Type of premises involved</td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td><p>Were the permises unoccupied?
Yes 
<input type="checkbox"> 
|
No <input type="checkbox">. if so, when were they last occupied?</p>
<p>&nbsp;</p></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td><p>Are the premises self-contained?
Yes <input type="checkbox"> 
|
No <input type="checkbox">. if not, please list the names of other occupants</p>
<p>&nbsp;</p></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td>Are you the owner of premises? Yes <input type="checkbox"> 
| No 
<input type="checkbox"></td>
<td>Are you responsible for repairs? Yes <input type="checkbox"> 
|
No <input type="checkbox"></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td height="1"><p>Have you any suspicion as to parties implicated? Yes
<input type="checkbox">
| No
<input type="checkbox">
</p></td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td height="1"><p>Is there any other insurance in force providing covers for this loss? If so, give particulars including insurers name, address, policy numbers, type of policy, etc.</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td height="1"><p>Have you suffered similar loss or damage in the past? If so, give particulars and whether claim was made on insurers</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</td>
</tr>
</table>
<table width="782" border="1" style="border-collapse:collapse;">
<tr>
<td height="1" style="border-collapse:collapse;"><p>At the time of loss, what was<br/>
the value of: a) the buildings? _______________________   b) all the property in the premises? _______________________</p>
</td>
</tr>
</table>
<p class="break"></p>
<table border="1" width="782" style="border-collapse:collapse; size: a4 portrait;">
<tr>
<td colspan="3" class="hdr" ><font color="#FFFFFF" >Complete in all cases involving THEFT, MALICIOUS DAMAGE or MISSING ARTICLES</font></td>
</tr>
<tr>
<td colspan="3"><p>When were the Police notified (date &amp; time)?
</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>Address of the Police Station?</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>what other steps have you taken to recover property?
</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>Give full details of method of entry to premmises</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>If alarm intalled, did it function properly? If not, give reasons
</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>Are guards employed? If so, name the firm
</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>Do other parties i.e. banks have an interest on property lost or damaged? If so, state reasons
</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3" class="hdr"><font color="#FFFFFF" >Compete in all cases involving loss in transit</font></td>
</tr>
<tr>
<td colspan="3"><p>Starting point and destination of transit
</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>Who was accompanying property lost or damaged?</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>If employees, state names, age and duties</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><p>Are they insured under Fidelity Guarantee Policy? If so, give insurer's name, address and policy number</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="2">How often is<br/> this transit made?</td>
<td width="543" colspan="1">What is maximum ever<br/> carried at on time?</td>
</tr>
<tr>
<td colspan="3" class="hdr"><font color="#FFFFFF" >AMOUNT CLAIMED</font></td>
</tr>
<tr>
<td colspan="3">Kenyan Shilings <br/>
Amount_________________________________Please refer to the following pages for details</td>
</tr>
<tr>
<td colspan="3">I / we declare that I / wehave not withheld any material information and that all statments made on this form are true to the best of my / our knowledge and belief. And that articles and property described overleaf belong to me / us, and that no other person has any interest whether as owner, mortgagee, trustee or otherwise except as mentioned in the policy.</p>
<p>Date____________________  Signature_____________________________________________</td>
</tr>
<td colspan="3"> <div align="right">(If policy Holder body corporate, title of person signing & Company Stamp)</div></td>
</tr>
</table>
<p class="break"></p>
</center>
<div id="non-printable" align="center">
<a href="logout.php">logout</a> | <a class="newww" href= "javascript:window.print();">Print</a></div>
</body>
</html>
Answers: