Css on print preview changes

[cdoggg94]

Attached I have an image of a page that looks the way I want (jodyNormal.jpg).  When I go to the print preview of the page, and when it prints, the div in the top right moves to the left. (jodyPrint.jpg)

 

this is the CSS for that Div:

 

#fertilizerCSS{
position:absolute;
height:379px;
width:397px;
left:391px;
top:134px;	
}

 

Does anyone have an idea why this could be happening on this page ?

[cdoggg94]

My first thought was that the Div had the same name as one of the form elements, so I changed the name of the Div to #fertilizerCSS but it was not the issue.

[cdoggg94]

this is the rest of the css on the page.

 

<style type="text/css">

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}

#wrapper{
position:relative;
height:100%;
width:800px;
margin:0px auto;
}

#header{
position:absolute;
height:148px;
width:309px;
left:2px;
top:14px;
}
	

#printPage2{
position:absolute;
height:65px;
width:50px;
top:26px;
left:645px;
}
	
#fertilizerCSS{
position:absolute;
height:379px;
width:397px;
left:391px;
top:134px;	
}

#services{
position:absolute;
height:632px;
width:760px;
left:0px;
top:526px;
}

#clientInfo{
position:absolute;
height:286px;
width:384px;
left:3px;
top:170px;
}

</style>

 

 

[Libellula]

Just a quick question, what program are you writing this in/ what are you printing from? I'm wondering if it's not specifically a coding issue but how the code is read when you send it to print...