Solved

Web page Print & Print Preview overlapping text

Posted on 2010-11-09
5
2,466 Views
Last Modified: 2012-06-21
Hi all. I have a page that I'm having trouble printing. If you check out this page:

http://vendortest.amieelynn.com/Print_Spec_Sheet.asp?Auto=170&Lic=Gem+Bella&Print=170&PrintChoice=Print_Spec_Sheet.asp&Print2=Print

Do a Print Preview (or click the "Make PDF or Print" button on the top left) & you will see that the "Description" line overlaps when it is too long. I need to print this using IE because parts of the site use ActiveX (although all other browsers overlap anyway). Can anyone help? My coding is below.

PS - I already tried changing the font to a bunch of other ones.

Thanks in advance.
Jon
<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>


<!--#include file="Connections/VendorIncVB.asp" -->
<%
' Add the button to the page
' Check to make sure querystring button is not set to hide
If Request.QueryString("button") = "" Then
    %><!-- #include file="SpecButtonInc.asp" --><%
End If
%>

<%
Dim StyleInfo__MMColParam
StyleInfo__MMColParam = "1"
If (Request.QueryString("Print") <> "") Then 
  StyleInfo__MMColParam = Request.QueryString("Print")
End If
%>
<%
Dim PrintSheet
Dim PrintCount
PrintCount = 0
PrintSheet = Split(StyleInfo__MMColParam,",")
%>
<%
For Each item In PrintSheet
%>

<%
Dim StyleInfo
Dim StyleInfo_cmd
Dim StyleInfo_numRows

Set StyleInfo_cmd = Server.CreateObject ("ADODB.Command")
StyleInfo_cmd.ActiveConnection = MM_VendorVB_STRING
StyleInfo_cmd.CommandText = "SELECT * FROM dbo.Style WHERE Auto = '"& PrintSheet(PrintCount) &"'" 
StyleInfo_cmd.Prepared = true
'StyleInfo_cmd.Parameters.Append StyleInfo_cmd.CreateParameter("param1", 5, 1, -1, StyleInfo__MMColParam) ' adDouble

Set StyleInfo = StyleInfo_cmd.Execute
StyleInfo_numRows = 0
%>
<%
Dim LicenseLogo__MMColParam
LicenseLogo__MMColParam = "1"
If (Request.QueryString("Lic") <> "") Then 
  LicenseLogo__MMColParam = Request.QueryString("Lic")
End If
%>
<%
Dim LicenseLogo
Dim LicenseLogo_cmd
Dim LicenseLogo_numRows
Dim LicenseName
LicenseName = (StyleInfo.Fields.Item("License").Value)

Set LicenseLogo_cmd = Server.CreateObject ("ADODB.Command")
LicenseLogo_cmd.ActiveConnection = MM_VendorVB_STRING
LicenseLogo_cmd.CommandText = "SELECT * FROM dbo.Licenses WHERE License = '"& LicenseName &"'" 
LicenseLogo_cmd.Prepared = true
'LicenseLogo_cmd.Parameters.Append LicenseLogo_cmd.CreateParameter("param1", 200, 1, 25, LicenseLogo__MMColParam) ' adVarChar

Set LicenseLogo = LicenseLogo_cmd.Execute
LicenseLogo_numRows = 0
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Spec Sheet</title>
<script type="text/javascript">
function popImage(imageURL,imageTitle,pos,AutoClose,CopyRight){
	//Safari workaround
	is_safari=(navigator.userAgent.toLowerCase().indexOf("safari")!=-1)?true:false;
	safari_version=Number(navigator.userAgent.substring(navigator.userAgent.indexOf("Safari/")+7));
	if (is_safari && safari_version<300){
		var f="top=0, left=0, width="+screen.width+",height="+screen.height+" ,scrollbars=yes";
		imgWin=window.open(imageURL,'im',f);
	}
	else{
		//Based on browser set correct resize mode
		if (parseInt(navigator.appVersion.charAt(0))>=4){
			if (navigator.appName=="Netscape" || is_safari){
				var f="width="+screen.width+",height="+screen.height;	
				var rs="var iWidth=window.innerWidth;iHeight=window.innerHeight";
				var adj="0";
			}
			if(document.all){
				var f="width=150,height=150";	
				var rs = "var iWidth=document.body.clientWidth;iHeight=document.body.clientHeight;";
				if(typeof window.opera != 'undefined'){ 
					 var adj="window.outerHeight-24";
				 }
				else{
					var adj="32";
				}	 
			} 
		}
		//
		v=pos.substring(0,pos.indexOf("_"));
		h=pos.substring(pos.indexOf("_")+1);
		f+=",left=0,top=0";
		imgWin=window.open('about:blank','',f);
		imDoc=imgWin.document;
		with (imDoc){
			writeln('<html><head><title>Loading...</title>');writeln('<sc'+'ript>');
			writeln('var sdstr=\"\";window.onerror=function(){return true;}');
			writeln('function resizeWin(){');
			//If the image size is bigger then screen resize window to the screen size
			writeln('sc=(navigator.userAgent.toLowerCase().indexOf("safari")!=-1)?15:"";');
			writeln('iW=document.images[0].width;iH=document.images[0].height;sW=screen.availWidth;sH=screen.availHeight;');
			writeln('if(iW>=sW || iH>=sH){window.resizeTo(sW,sH);window.moveTo(0,0)}else{');
			writeln(rs);
			writeln('var v=\"'+v+'\";var h=\"'+h+'\";');
			writeln('switch (v){case \"top\":vPos=0;break;case \"middle\":vPos=(sH-iH-'+adj+')/2;break;case \"bottom\":vPos=sH-'+adj+'-iH'+((is_safari)?'-20':'')+';break;default: vPos=0;}');
			
			writeln('switch (h){case \"left\":hPos=0;break;case \"center\":hPos=(sW-iW)/2;break;case \"right\":hPos=sW-iW'+((is_safari)?'-20':'')+';break;default: hPos=0;}');
			writeln('iWidth = document.images[0].width - iWidth;iHeight = document.images[0].height - iHeight;');
			writeln('window.resizeBy(iWidth+sc, iHeight+sc);');
			writeln('window.moveBy(hPos,vPos)}}');
			writeln('function doTitle(){document.title="'+unescape(imageTitle)+'";}'+'</sc'+'ript>');
			var cT=(!AutoClose)?"":"onBlur=\"sdstr=setTimeout('window.close(this)',1000)\"";
			//Prevent closing in IE
			var fL=(!AutoClose)?"":"onfocus=\"clearTimeout(sdstr)\"";
			var safari_fix=(is_safari)?" onload='resizeWin()'":"";
			var opera9_fix= (window.opera && window.getSelection)?" onload='doTitle();'":"";
			if(!CopyRight){var cr1="";var cr2=""}else{var cr1=" galleryimg=\"no\" title=\"Copyright Protected\" onmousedown=\"window.close()\" ";var cr2="oncontextmenu=\"return false\" "}
			writeln('</head><body  leftmargin=\"0\" topmargin=\"0\" marginwidth=\"0\" marginheight=\"0\" bgcolor=\"FFFFFF\"  onload="'+ ((!is_safari)?'resizeWin();doTitle();':'')+'self.focus()" '+cT+' '+fL+' '+cr2+'>');
			writeln('<div '+fL+' align=\"center\" style=\"width:100%;height:100%;overflow:auto\"><img src="'+imageURL+'" '+cr1+safari_fix+opera9_fix+' ></div></body></html>');
			close();
		}
	}
}
</script>
</head>


<body>
<p>
  <style type="text/css">
body {
	font-size: 12px;
	font-family: Arial;
	line-height: 0px;
	margin-left: 50px;
	margin-right: 50px;
	
	}
	
</style>
  
  <style type="text/css">
.specpic {
  max-height: 400px;
  height: expression(this.height > 400 ? "400px" : true);
}
</style>
  
  <style type="text/css">
.logopic {
  max-height: 140px;
  height: expression(this.height > 140 ? "140px" : true);
}
</style>
  
  <%
If PrintCount > 0 Then 
response.write("<p>&nbsp;</p>")
End If
%>

<%
If (StyleInfo.Fields.Item("Division").Value = "Fair Weather") Then
%>
<center><img class="logopic" src="http://Vendor.AmieeLynn.com/Images/<%=(LicenseLogo.Fields.Item("LogoName").Value)%>" /></center>
<br /><br /><br />
<p>	Amiee Lynn Style #: <strong><%=(StyleInfo.Fields.Item("AL_Style").Value)%></strong></p>
<p>License: <strong><%=(StyleInfo.Fields.Item("License").Value)%></strong></p>
<p>Description: <strong><%=(StyleInfo.Fields.Item("Description").Value)%></strong></p>
<p>Color: <strong><%=(StyleInfo.Fields.Item("Color").Value)%></strong></p>
<p>Fiber / Material Content: <strong><%=(StyleInfo.Fields.Item("Fiber_Material").Value)%></strong></p>
<p>Vendor / Factory: <strong><%=(StyleInfo.Fields.Item("Vendor_Factory").Value)%></strong></p>
<p>Vendor Reference #: <strong><%=(StyleInfo.Fields.Item("Vendor_Reference").Value)%></strong></p>
<p>Minimum Order Quantity: <strong><%=(StyleInfo.Fields.Item("Minimum").Value)%></strong></p>
<p>First Cost: <b>$ </b> <strong><%=(StyleInfo.Fields.Item("First_Cost").Value)%></strong> + <strong> <%=(StyleInfo.Fields.Item("Duty").Value)%></strong><b> % </b>Duty</p>
<p>HTS Code: <strong><%=(StyleInfo.Fields.Item("HTS_Code").Value)%></strong></p>
<p>Weight: <strong><%=(StyleInfo.Fields.Item("Weight").Value)%></strong> g</p>
<p>Weight: <strong><%=(StyleInfo.Fields.Item("WeightLbs").Value)%></strong> lbs</p>
<p>Size: <strong><%=(StyleInfo.Fields.Item("Size").Value)%></strong></p>
<p>Shipping Cost: <strong><%=(StyleInfo.Fields.Item("ShippingCost").Value)%></strong></p>
<p>Misc Cost: <strong><%=(StyleInfo.Fields.Item("MiscCost").Value)%></strong></p>
<p>Landed Cost: <strong><%=(StyleInfo.Fields.Item("LandedCost").Value)%></strong></p>
<p>Notes: <strong><%=(StyleInfo.Fields.Item("Notes").Value)%></strong></p>
<p>Is this item compliant with CPSIA regulations for flammability or Prop 65 regulations regarding Lead and Cadmium in Accessories? <strong><%=(StyleInfo.Fields.Item("CPSIA").Value)%></strong></p>
<p>Is this item produced in a factory that has been audited for social compliance? <strong><%=(StyleInfo.Fields.Item("Social_Compliance").Value)%></strong></p>
Does this item contain components that fall under F&amp;W jurisdiction?<strong> <%=(StyleInfo.Fields.Item("F_W").Value)%></strong>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<center>

<img class="specpic" src="http://Vendor.AmieeLynn.com/Images/<%=(StyleInfo.Fields.Item("File_Name").Value)%>" alt="" onclick="popImage('http://Vendor.AmieeLynn.com/Images/<%=(StyleInfo.Fields.Item("File_Name").Value)%>','Amiee%20Lynn%20Style','top_left',false,false)" /></a>

</center>

<%
elseIf (StyleInfo.Fields.Item("Division").Value = "29 Palms") Then
%>
<center><img class="logopic" src="http://Vendor.AmieeLynn.com/Images/<%=(LicenseLogo.Fields.Item("LogoName").Value)%>" /></center>
<br /><br /><br />
<p>	Amiee Lynn Style #: <strong><%=(StyleInfo.Fields.Item("AL_Style").Value)%></strong></p>
<p>License: <strong><%=(StyleInfo.Fields.Item("License").Value)%></strong></p>
<p>Description: <strong><%=(StyleInfo.Fields.Item("Description").Value)%></strong></p>
<p>Color: <strong><%=(StyleInfo.Fields.Item("Color").Value)%></strong></p>
<p>Fiber / Material Content: <strong><%=(StyleInfo.Fields.Item("Fiber_Material").Value)%></strong></p>
<p>Vendor / Factory: <strong><%=(StyleInfo.Fields.Item("Vendor_Factory").Value)%></strong></p>
<p>Vendor Reference #: <strong><%=(StyleInfo.Fields.Item("Vendor_Reference").Value)%></strong></p>
<p>Minimum Order Quantity: <strong><%=(StyleInfo.Fields.Item("Minimum").Value)%></strong></p>
<p>First Cost: <b>$ </b> <strong><%=(StyleInfo.Fields.Item("First_Cost").Value)%></strong> + <strong> <%=(StyleInfo.Fields.Item("Duty").Value)%></strong><b> % </b>Duty</p>
<p>HTS Code: <strong><%=(StyleInfo.Fields.Item("HTS_Code").Value)%></strong></p>
<p>Weight: <strong><%=(StyleInfo.Fields.Item("Weight").Value)%></strong> g</p>
<p>Weight: <strong><%=(StyleInfo.Fields.Item("WeightLbs").Value)%></strong> lbs</p>
<p>Size: <strong><%=(StyleInfo.Fields.Item("Size").Value)%></strong></p>
<p>Is this item compliant with CPSIA regulations for flammability or Prop 65 regulations regarding Lead and Cadmium in Accessories? <strong><%=(StyleInfo.Fields.Item("CPSIA").Value)%></strong></p>
<p>Is this item produced in a factory that has been audited for social compliance? <strong><%=(StyleInfo.Fields.Item("Social_Compliance").Value)%></strong></p>
Does this item contain components that fall under F&amp;W jurisdiction?<strong> <%=(StyleInfo.Fields.Item("F_W").Value)%></strong>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<center>

<img class="specpic" src="http://Vendor.AmieeLynn.com/Images/<%=(StyleInfo.Fields.Item("File_Name").Value)%>" alt="" onclick="popImage('http://Vendor.AmieeLynn.com/Images/<%=(StyleInfo.Fields.Item("File_Name").Value)%>','Amiee%20Lynn%20Style','top_left',false,false)" /></a>

</center>


<%
else
%>

<center><img class="logopic" src="http://Vendor.AmieeLynn.com/Images/<%=(LicenseLogo.Fields.Item("LogoName").Value)%>" /></center>
<br /><br /><br />
<p>	Amiee Lynn Style #: <strong><%=(StyleInfo.Fields.Item("AL_Style").Value)%></strong></p>
<p>License: <strong><%=(StyleInfo.Fields.Item("License").Value)%></strong></p>
<p>Description: <strong><%=(StyleInfo.Fields.Item("Description").Value)%></strong></p>
<p>Color: <strong><%=(StyleInfo.Fields.Item("Color").Value)%></strong></p>
<p>Fiber / Material Content: <strong><%=(StyleInfo.Fields.Item("Fiber_Material").Value)%></strong></p>
<p>Vendor / Factory: <strong><%=(StyleInfo.Fields.Item("Vendor_Factory").Value)%></strong></p>
<p>Vendor Reference #: <strong><%=(StyleInfo.Fields.Item("Vendor_Reference").Value)%></strong></p>
<p>Minimum Order Quantity: <strong><%=(StyleInfo.Fields.Item("Minimum").Value)%></strong></p>
<p>First Cost: <b>$ </b> <strong><%=(StyleInfo.Fields.Item("First_Cost").Value)%></strong> + <strong> <%=(StyleInfo.Fields.Item("Duty").Value)%></strong><b> % </b>Duty</p>
<p>HTS Code: <strong><%=(StyleInfo.Fields.Item("HTS_Code").Value)%></strong></p>
<p>Weight: <strong><%=(StyleInfo.Fields.Item("Weight").Value)%></strong> g</p>
<p>Notes: <strong><%=(StyleInfo.Fields.Item("Notes").Value)%></strong></p>
<p>Is this item compliant with CPSIA regulations for flammability or Prop 65 regulations regarding Lead and Cadmium in Accessories? <strong><%=(StyleInfo.Fields.Item("CPSIA").Value)%></strong></p>
<p>Is this item produced in a factory that has been audited for social compliance? <strong><%=(StyleInfo.Fields.Item("Social_Compliance").Value)%></strong></p>
Does this item contain components that fall under F&amp;W jurisdiction?<strong> <%=(StyleInfo.Fields.Item("F_W").Value)%></strong>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<center>

<img class="specpic" src="http://Vendor.AmieeLynn.com/Images/<%=(StyleInfo.Fields.Item("File_Name").Value)%>" alt="" onclick="popImage('http://Vendor.AmieeLynn.com/Images/<%=(StyleInfo.Fields.Item("File_Name").Value)%>','Amiee%20Lynn%20Style','top_left',false,false)" /></a>

</center>

<%
end if
%>

<br /><br />
</body>
</html>
<p style="page-break-before: always">
<%
StyleInfo.Close()
Set StyleInfo = Nothing
%>
<%
LicenseLogo.Close()
Set LicenseLogo = Nothing
%>
<%
PrintCount = PrintCount + 1
Next

%>

Open in new window

0
Comment
Question by:Jon DeVito
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 6

Accepted Solution

by:
CyberGhost earned 500 total points
ID: 34099951
instead of using inline CSS (style tags), I would create an external CSS file and use a print stylesheet in order to adjust your page for printing purposes... more info can be found here: http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml

that way, you can separate what will user see on screen and what will be printed - and debug the overlapping as well
0
 
LVL 3

Author Comment

by:Jon DeVito
ID: 34102825
I'm having all kinds of problems with the print stylesheet but I now see where my problem lies. I am using "line-height: 0px;" on line 145 to stop the double-spacing as I need everything to fit on one page. If I remove that line (or make it a larger #) everything works but not fitting to the page which is necessary...
Any ideas how to keep the single spacing another way?

Thanks.
Jon
0
 
LVL 3

Assisted Solution

by:Jon DeVito
Jon DeVito earned 0 total points
ID: 34103624
I was able to figure it out. I had to remove all of the <p> & </p> tags I had in there, add a <br /> to move to the next line, then remove the "line-height: 0px" setting. That totally fixed the problem. Since I know doing a print stylesheet is a better way plus trying it that way made me play with my css settings which led me to the root problem, you get the points. Thanks again for the help!

Jon
0
 
LVL 6

Expert Comment

by:CyberGhost
ID: 34104446
glad I could assist :)
0
 
LVL 3

Author Closing Comment

by:Jon DeVito
ID: 34134615
Thanks again.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
original content 7 115
Secure log in 'box' 4 40
WordPress navigation menus: how to change color when clicked 10 41
CSS question 16 58
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

740 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question