[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

Web page Print & Print Preview overlapping text

Posted on 2010-11-09
5
Medium Priority
?
2,715 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 2000 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

[Webinar] Lessons on Recovering from Petya

Skyport is working hard to help customers recover from recent attacks, like the Petya worm. This work has brought to light some important lessons. New malware attacks like this can take down your entire environment. Learn from others mistakes on how to prevent Petya like worms.

Question has a verified solution.

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

Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
When the s#!t hits the fan, you don’t have time to look up who’s on call, draft emails, call collaborators, or send text messages. An instant chat window is definitely the way to go, especially one like HipChat. HipChat is a true business app. An…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

650 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