Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Senior Coder
    Join Date
    Dec 2002
    Location
    Arlington, Texas USA
    Posts
    1,072
    Thanks
    4
    Thanked 8 Times in 8 Posts

    Problem in IE when printing

    I have a dynamically generated report that when the user is using IE 11 and they go to print the report, part of the report is not displayed.


    It is driving me bonkers because it is the same code used for the following page and it prints fine.

    It displays normally on the screen. It is only when printing.


    Attached are 2 images.
    Problem in IE when printing-ie11_print_issue.png
    Problem in IE when printing-ie11_print_issue_2.png

    the top image (titled IE11_Print_Issue.png) shows the one page that is not printing correctly the other image shows the page that does print correctly


    To see this in action go to this URL
    http://www.virtualhrcenter.com/admin...nly=1&Sample=R

    Here is the html for the two pages
    Code:
    <div class="page" style="width:963px; height:1210px;margin:0 auto">
    	<div class="pageTop" style="border:1px solid #FFFFFF">
    		<div style="width:410px; float:left;">&nbsp;</div>
    		<div class="smallLogo"><img src="/images/report/SM_Icon_A_Blue.png" alt="Report Logo"></div>
    		<div style="clear:both"></div>
    		<div class="pagehead">Achiever</div>
    		<div style="clear:both"></div>
    		<div style="float:left; width:300px;">
    			<div style="width:100px; float:left">Name:<br />Company:</div>
    			<div style="width:200px; float:left">Joe Smith<br />XYZ Company</div>
    			<div style="clear:both"></div>
    		</div>
    		<div style="float:left; width:305px; text-align:center"></div>
    		<div style="float:left; width:155px;"></div>
    		<div style="float:right; width:145px;">
    			<div style="width:55px; float:left">Date:<br />Page:</div>
    			<div style="width:90px;float:left">2/12/2006<br />1</div>
    		</div>
    		<div style="clear:both;"></div>
    	</div>
    	<br />
    	<div style=""><img src="/images/report/Nar_Mental_Bar.png" alt="Mental Aptitudes"/></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Mental Acuity</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_4.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Mr. Smith is low-average in Mental Acuity, indicating he is slower in his thinking, comprehension and reasoning ability than is needed for more difficult tasks.  He will need to take time to make a decision or solve a more challenging problem, particularly if the situation involves data which is unfamiliar to him.  Some level of supervision and thorough training will need to be available until he is proficient in the job.</div>
    	<div style="clear:both"></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Business Terms</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_6.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Joe has an average understanding of business terminology obtained either on the job or in a business class.</div>
    	<div style="clear:both"></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Memory Recall</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_9.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Mr. Smith has a superior knowledge of events happening in the world around him and should be strongly aware of competitive trends, as well as the economy's effect on business.</div>
    	<div style="clear:both"></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Vocabulary</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_6.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Mr. Smith's language skills are good and should enable him to communicate effectively with others.</div>
    	<div style="clear:both"></div>
    	<div style="clear:both;"></div>
    </div>
    <div style="text-align:center; margin-top:10px;font-size:.8em;">Copyright&copy; 1999-2014 Candidate Resources, Inc.</div>
    
    <div class="page" style="page-break-before:always;width:963px; height:1210px;margin:0 auto">
    	<div class="pageTop" style="border:1px solid #FFFFFF">
    		<div style="width:410px; float:left;">&nbsp;</div>
    		<div class="smallLogo"><img src="/images/report/SM_Icon_A_Blue.png" alt="Report Logo"></div>
    		<div style="clear:both"></div>
    		<div class="pagehead">Achiever</div>
    		<div style="clear:both"></div>
    		<div style="float:left; width:300px;">
    			<div style="width:100px; float:left">Name:<br />Company:</div>
    			<div style="width:200px; float:left">Joe Smith<br />XYZ Company</div>
    			<div style="clear:both"></div>
    		</div>
    		<div style="float:left; width:305px; text-align:center"></div>
    		<div style="float:left; width:155px;"></div>
    		<div style="float:right; width:145px;">
    			<div style="width:55px; float:left">Date:<br />Page:</div>
    			<div style="width:90px;float:left">2/12/2006<br />2</div>
    		</div>
    		<div style="clear:both;"></div>
    	</div>
    	<br />
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Numerical Perception</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_9.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Joe's superior Numerical Perception score indicates that he can process data quickly and correctly.  Joe's decision-making skills are enhanced by his ability to identify critical features in his work.</div>
    	<div style="clear:both"></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Mechanical Interest</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_5.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div><div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Joe is interested in machines and probably willing to devote extra time to learn the technology used at work.  Please note that this aptitude measures interest, not mechanical ability.</div>
    	<div style="clear:both"></div>
    	<br />
    	<div style=""><img src="/images/report/Nar_Person_Bar.png" alt="Personality Dimenstions"/></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Energy</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_2.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Mr. Smith is a very energized individual who takes an active approach to job assignments and other matters.  Even though he has a high drive and energy level, he could become less productive and lose his ability to concentrate due to his high degree of tension.  This, in turn, could cause errors.</div>
    	<div style="clear:both"></div>
    	<div style="text-align:center;font-weight:bold; font-size:1.1em; padding-top:15px">Flexibility</div>
    	<div style="width:185px;float:left;">&nbsp;</div>
    	<div style="width:573px;float:left;"><img src="/images/report/Nar_Stanine_Blk_8.png" alt="" /></div>
    	<div style="clear:both"></div>
    	<div style="float:left; width:45px">&nbsp;</div>
    	<div class="roundedCorners pg" style="width:860px; float:left; border:1px solid #000000; padding:10px; margin-top:15px; margin-bottom:25px; background-color:#E4EAFF; border-radius:4px;">Joe is a very quality-minded, reliable individual with a high degree of integrity and strong ethics.  He has a strong interest in providing quality service and products to customers, but is not very flexible or adaptable to change.  This could cause him to experience difficulty handling multiple job demands and assignments.  He tends not to be an innovative, free-thinking person who creates new ways of doing things or new uses for existing applications of products or services, but rather will be one who sticks with proven applications as much as possible.  He is likely to agree to change only when he is convinced the change is necessary.  Even though the company can trust him and know he will be concerned that customers' needs are being met, they cannot expect frequent, imaginative or fresh ideas from him.</div>
    	<div style="clear:both"></div>
    	<div style="clear:both;"></div>
    </div>
    <div style="text-align:center; margin-top:10px;font-size:.8em;">Copyright&copy; 1999-2014 Candidate Resources, Inc.</div>

    Here is the CSS file
    Code:
    body{
    	font:1em Arial, Tahoma, Sans-Serif;
    }
    img{
    	border: 0;
    	vertical-align:middle;
    }
    p{
    	margin-top: 3px;
    	margin-bottom: 3px;
    }
    .page{
    	width:963px;
    	margin:0 auto;
    }
    .pageTop{
    	width:963px;
    	margin:0 auto;
    	padding:0px 20px;
    }
    .pagehead{
    	width:100%;
    	text-align:center;
    	font:bold 1.1em Arial, Tahoma, Sans-Serif;
    }
    #ReportCover{
    	width:963px; 
    	height:1283px;
    	margin:0 auto;
    	 
    }
    #largeLogo{
    	width:270px;
    	margin:0 auto;
    }
    .smallLogo{
    	margin-top:10px;
    	width:400px;
    	float:left;
    }
    .leftCol{
    	width:300px;
    	float:left;
    }
    .leftInside{
    	width:100px;
    	float:left;
    }
    .rightInside{
    	width:200px;
    	float:left;
    }
    .middleCol{
    	width:500px;
    	float:left;
    	text-align:center;
    }
    .rightCol{
    	width:145px;
    	float:right;
    }
    .IQTopBorder{
    	width: 432px;
    	height: 17px;
    	margin: 0 auto;
    	background: url(/images/report/IQ_Dialogue_Top.png);
    	margin-bottom: 0px;
    }
    .IQSideBorder{
    	margin-left: 0px;
    	margin-right: 0px;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	background: url(/images/report/IQ_Dialogue_Middle.png);
    }
    .IQbottomBorder{
    	width: 432px;
    	height: 17px;
    	margin-top: 0px;
    	margin: 0 auto;
    	background: url(/images/report/IQ_Dialogue_Bottom.png);
    }
    .pg {
    	filter:progid:DXImageTransform.Microsoft.Shadow(color='#666666', Direction=135, Strength=10);
    	box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.50);
    	-moz-box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.50);
    	-webkit-box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.50);
    }
    .names{
    	float:left
    }
    .scores{
    	width:577px;
    	float:left;
    }
    .Odd{
    	background:#FFFFFF;
    }
    .Even{
    	background: url('/images/report/SS_LightBlueBar.png') no-repeat;
    }
    .highs{
    	float:left;
    }
    .devsug li{
    	padding-bottom:10px;
    }
    #devplan{
    	width:900px;
    	margin:0 auto;
    	text-align:center;
    	padding:50px;
    }
    .Scoresheet{
    	width:953px;
    	border: 1px solid #000000;
    	padding:5px 3px 0px 10px;
    	border-radius:10px;
    	filter:progid:DXImageTransform.Microsoft.Shadow(color='#666666', Direction=135, Strength=10);
    	box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.50);
    	-moz-box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.50);
    	-webkit-box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.50);
    }
    .red{
    	background-color: #FF0000;
    }
    .yellow{
    	background-color: #FFCC00;
    }
    .green{
    	background-color: #009900;
    }
    @media print {
    	#devplan{
    		display:none;
    	}
    	#print{
    		display:none;
    	}
    	.page{
    		vertical-align:top;
    	}
    }


    Thanks in advance for any help with this
    Last edited by miranda; 04-23-2014 at 08:24 PM. Reason: Added URL to report

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,861
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Markup validator ([Invalid] Markup Validation of http://www.virtualhrcenter.com/admin/Report.asp?RecID=225559&Sec=MIRNDA&Config=11110110000&dbx=Custom&job=1&useVerb=ACHVR&OverRide=0&shee tOnly=1&Sample=R - W3C Markup Validator) says
    Line 107, Column 12: Stray end tag div.

    </div></div><div style="text-align:center; margin-top:10px;font-size:.8em;">Cop…
    Start with fixing this error.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Senior Coder
    Join Date
    Dec 2002
    Location
    Arlington, Texas USA
    Posts
    1,072
    Thanks
    4
    Thanked 8 Times in 8 Posts
    The issue is still there after the stray tag was removed. However, that was way after the problem (line 22 in the validator is where the code is not printing) so that extra end div tag would not have caused the issue.

    Does anyone else have any idea as to what the problem is?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •