jmfavero
10-08-2010, 10:05 PM
OK so here's the problem...
If I add the simple line of code to my print.css #content div:
float: none !important
the title in the header in IE shows up at the bottom of the first page, and all the pages print in FireFox.
If I remove that line of code, the title in the header shows up where it's supposed to in IE, but only the first page will print in FireFox.
Obviously, I need it to print all the pages, and the header needs to stop bouncing around on the page. It needs to sit at the top, and just stay! LOL.
I have validated the CSS through this site (http://htmlhelp.com/tools/csscheck/), and it shows no problems. I have tried to input overrides, as displayed on this page (http://geekswithblogs.net/mnf/archive/2008/02/13/declare-different-css-rules-for-firefox-and-internet-explorer-7.aspx) and nothing works.
I'm really ready to say good-bye to my project, so any help is appreciated.
Print.css
a{color: #520;
text-decoration: underline;}
body {font-size: 14pt;}
#content {
border: 0;
color: black;
margin: 0 5%;
padding: 0;
padding-top: 1em;
width: auto;}
#footer {display:none;}
#SwapStyle {
display: none;}
Applied Stylesheet:
/*Color Codes*/
/*Light Red #D6AEAA*/
/*Red #CD3529*/
/*Dark Red #92261D*/
/*Light Blue #A0B2DB*/
/*Dark Blue #01447B*/
/*Body*/
body
{background-color:#fff;
font-family:Geneva, Arial, Verdana, sans-serif;
margin:0px;
padding:0px;
font-size:80%;}
#contain
{width:1023px;
text-align:left;
position:relative;
margin:0px auto;
padding-left:80px;
background-image:url("/Images/TemplateImages/background.jpg");
background-color:#fff;
background-repeat:repeat-y;}
#intro
{width:863px;
height:90px;
border:none;
background-color:#fff;
padding-top:5px;}
/*Header*/
#Title
{position:absolute;
left:275px;
top:50px;
background:no-repeat;}
/*content*/
#content
{float:left;
width:843px;
padding:30px 10px 10px 10px;
background-color:#fff;}
#content:after
{content:".";
display:block;
height:0px;
clear:both;
visibility:hidden;}
#content p
{margin-left:10px;}
/*---SwapStyle---*/
#SwapStyle
{position:absolute;
left:846px;
height:20px;
width:200px;
color:#333;
font-size:85%;
padding-top:10px;}
#SwapStyle a
{text-decoration:none;
color:#333;}
#SwapStyle img
{border:none;}
/*Footer*/
#footer
{width:865px;
height:75px;clear:both;}
#footer p
{color:#fff;
text-align:center;
font-size:90%;
padding:14px 0px 2px 0px;}
#footer:after
{content:".";
display:block;
height:0px;
clear:both;
visibility:hidden;}
#footer a
{color:#fff;
text-decoration:none;
margin:0px;
padding:0px;
list-style:none;}
#footer a:hover
{color:#CD3529;
text-decoration:underline;}
#footer ul
{margin:0px;
text-align:center;
padding:0px 0px 0px 80px;
list-style-type:none;
font-weight:600;
font-size:90%;
color:#fff;}
#footer li
{margin:0px 8px 0px 0px;
padding:10px 80px 0px 0px;
display:inline;
color:#fff;}
#FooterImg
{color:#fff;
text-align: right;
font-size:80%;
position:absolute;
left:820px;
background:no-repeat;
display:block;}
/*Start Content Format*/
/*Paragraph Styles*/
h1,h2,h3,h4,h5,h6,h7
{font-family:Arial, Geneva, Verdana, sans-serif;
font-weight:600;}
h1
{color:#134679;
font-size:xx-large;
margin:0px;}
h2
{color:#CD3529;
font-size:x-large;}
h3
{color:#134679;
font-size:large;}
h4
{color:#CD3529;
font-size:medium;}
h5
{color:#134679;
font-size:small;}
h6
{color:#CD3529;
font-size:x-small;
font-style:normal;}
h7
{color:#000000;
font-size:xx-small;}
a
{color:#134679;}
a:hover
{color:#cd3529;
text-decoration:none;}
ul
{line-height:125%;
list-style:none;
margin-left:30px;
padding:0px;}
li
{line-height:125%;
list-style:disc;
margin:0px 0px 10px;
padding:0px;}
#HomeContent
{float:left;
width:603px;
padding:10px 10px 20px;
background-color:#fff;}
#HomeContent p
{line-height:150%;
color:#000;
margin-left:10px;
font-size:110%;}
#RightNav
{float:right;
width:210px;
color:#000;
background-color:transparent;
font-size:85%;
padding:0px 0px 0px 0px;
margin:0px;}
#InternalContent
{float:right; width:625px;}
#InternalContent p
{line-height:150%;
color:#000;
font-size:110%;
margin-left:10px;}
#InternalContent h1
{color:#134679;
font-size:xx-large;}
#InternalContent h2
{color:#CD3529;
font-size:x-large;}
#InternalContent h3
{color:#134679;
font-size:large;}
#InternalContent h4
{color:#CD3529;
font-size:medium;}
#InternalContent h5
{color:#134679;
font-size:small;}
#InternalContent h6
{color:#CD3529;
font-size:x-small;
font-style:normal;}
#InternalContent h7
{color:#000000;
font-size:xx-small;}
/*Table Styles*/
table#Contact td
{padding:5px;
vertical-align:top;}
.p
{line-height:125%;
color:#000;
margin-left:10px;
font-size:95%;}
.h2
{color:#CD3529;
font-size:large;}
.h3
{color:#134679;
font-size:medium;
font-weight:600;}
/*Character Styles*/
.Bold
{font-weight:600;}
.Bold1
{font-weight:600;
color:#CD3529;}
.Bold2
{font-weight:600;
color:#01447B;}
.Italic
{font-style:italic;}
.BoldItalic
{font-weight:600;
font-style:italic;}
.Captions
{font-size:10pt;}
.ImageBorder
{border:#01447B solid 2px;}
.Bullets li {background:url("/I[/CODE]mages/TemplateImages/Bullet.png") no-repeat; background-position:inherit; padding:0px 0px 5px 40px; line-height:1.5em; list-style:none;}
/*Inserts Spaces between elements, use as DIV tags, put an
between the div id tag and div closing tag - Small Spacers = 1 line. Med Spacers = 2 lines, large spacers=3 lines, xl Spacers = 4 lines */
#SmSpacer
{padding:5px;}
#SmSpacer1
{padding:5px;}
#SmSpacer2
{padding:5px;}
#SmSpacer3
{padding:5px;}
#SmSpacer4
{padding:5px;}
#MedSpacer
{padding:10px;}
#MedSpacer1
{padding:10px;}
#MedSpacer2
{padding:10px;}
#MedSpacer3
{padding:10px;}
#MedSpacer4
{padding:10px;}
#MedSpacer
{padding:10px;}
#LgSpacer
{padding:15px;}
#LgSpacer1
{padding:15px;}
#LgSpacer2
{padding:15px;}
#LgSpacer3
{padding:15px;}
#LgSpacer4
{padding:15px;}
#XLSpacer
{padding:20px;}
#XLSpacer1
{padding:20px;}
#XLSpacer2
{padding:20px;}
#XLSpacer3
{padding:20px;}
#XLSpacer4
{padding:20px;}
/*Boxes - Use these to insert feature boxes on the Page */
/*Navigation Box - this box controls your navigation pieces on your internal pages. It floats to the left. Inserting bullets in this box will give each line a solid round bullet, and links will appear in blue.*/
#Navigation
{background-color:#ddd;
color:black;
border-top:1px solid #01447B;
border-bottom:1px solid #01447B;
border-right:1px solid #01447B;
border-left:1px solid #01447B;
width:200px;
float:left;
margin-bottom:5px;
margin-top:5px;
margin-right:7px;}
#Navigation h1
{padding-left:2px;
margin:2px;
padding-bottom:2px;
line-height:135%;
font-weight:600;
color:#CD3529;
font-size:small;}
#Navigation p
{padding-left:5px;
margin:2px;
line-height:135%}
#Navigation ul
{padding-left:15px;
margin:2px;
line-height:135%;
list-style:disc}
#Navigation a
{color:#01447B;
text-decoration:underline;}
/*Box1 has a white background, with a 1 px solid border. Inserting a h1 in this box will allow the h1 line to have a light red background with the text in black. This Box floats to the right of content. */
#Box1
{background-color:#fff;
color:black;
border:1px solid #333;
margin-bottom:10px;
margin-top:10px;
width:200px;
float:right;
margin-left:7px;}
#Box1 h1
{color:#000;
font-size:14px;
background-color:#D6AEAA;
padding:0px;
margin-bottom:10px;
margin-top:0px;
padding:2px;
text-align:center;}
#Box1 h2
{color:#000;
font-size:16px;
font-weight:600;
padding-left:4px;}
#Box1 p
{padding-left:7px;
margin:5px;
line-height:135%}
#Box a
{color:#01447B;
text-decoration:none;}
/*Box2* has a white background with a 1px solid border. Inserting an image in this box will float it left, and give it a little space between the image and the box edge. This Box floats to the right of content.*/
#Box2
{background-color:#fff;
color:black;
border:1px solid #333;
width:200px;
margin-bottom:5px;
margin-top:5px;
float:right;
margin-left:7px;}
#Box2 p
{padding-left:5px;
margin:2px;
line-height:135%}
#Box2 img
{float:right;
padding-right:5px;}
/*Box3* allows you to post an image in the box without and space around it the paragraphs in this box do not have any extra space between them. This Box floats to the right of content.*/
#Box3
{background-color:#fff;
color:black;
border:1px solid #333;
width:200px;
float:right;
margin-bottom:5px;
margin-top:5px;
margin-left:7px;}
#Box3 img
{padding-bottom:5px;}
#Box3 p
{padding-left:5px;
margin:2px;
line-height:135%}
#FaceBook
{background-color:#fff;
width:205px;
float:right;
margin-bottom:5px;
margin-top:5px;
margin-left:7px;}
If I add the simple line of code to my print.css #content div:
float: none !important
the title in the header in IE shows up at the bottom of the first page, and all the pages print in FireFox.
If I remove that line of code, the title in the header shows up where it's supposed to in IE, but only the first page will print in FireFox.
Obviously, I need it to print all the pages, and the header needs to stop bouncing around on the page. It needs to sit at the top, and just stay! LOL.
I have validated the CSS through this site (http://htmlhelp.com/tools/csscheck/), and it shows no problems. I have tried to input overrides, as displayed on this page (http://geekswithblogs.net/mnf/archive/2008/02/13/declare-different-css-rules-for-firefox-and-internet-explorer-7.aspx) and nothing works.
I'm really ready to say good-bye to my project, so any help is appreciated.
Print.css
a{color: #520;
text-decoration: underline;}
body {font-size: 14pt;}
#content {
border: 0;
color: black;
margin: 0 5%;
padding: 0;
padding-top: 1em;
width: auto;}
#footer {display:none;}
#SwapStyle {
display: none;}
Applied Stylesheet:
/*Color Codes*/
/*Light Red #D6AEAA*/
/*Red #CD3529*/
/*Dark Red #92261D*/
/*Light Blue #A0B2DB*/
/*Dark Blue #01447B*/
/*Body*/
body
{background-color:#fff;
font-family:Geneva, Arial, Verdana, sans-serif;
margin:0px;
padding:0px;
font-size:80%;}
#contain
{width:1023px;
text-align:left;
position:relative;
margin:0px auto;
padding-left:80px;
background-image:url("/Images/TemplateImages/background.jpg");
background-color:#fff;
background-repeat:repeat-y;}
#intro
{width:863px;
height:90px;
border:none;
background-color:#fff;
padding-top:5px;}
/*Header*/
#Title
{position:absolute;
left:275px;
top:50px;
background:no-repeat;}
/*content*/
#content
{float:left;
width:843px;
padding:30px 10px 10px 10px;
background-color:#fff;}
#content:after
{content:".";
display:block;
height:0px;
clear:both;
visibility:hidden;}
#content p
{margin-left:10px;}
/*---SwapStyle---*/
#SwapStyle
{position:absolute;
left:846px;
height:20px;
width:200px;
color:#333;
font-size:85%;
padding-top:10px;}
#SwapStyle a
{text-decoration:none;
color:#333;}
#SwapStyle img
{border:none;}
/*Footer*/
#footer
{width:865px;
height:75px;clear:both;}
#footer p
{color:#fff;
text-align:center;
font-size:90%;
padding:14px 0px 2px 0px;}
#footer:after
{content:".";
display:block;
height:0px;
clear:both;
visibility:hidden;}
#footer a
{color:#fff;
text-decoration:none;
margin:0px;
padding:0px;
list-style:none;}
#footer a:hover
{color:#CD3529;
text-decoration:underline;}
#footer ul
{margin:0px;
text-align:center;
padding:0px 0px 0px 80px;
list-style-type:none;
font-weight:600;
font-size:90%;
color:#fff;}
#footer li
{margin:0px 8px 0px 0px;
padding:10px 80px 0px 0px;
display:inline;
color:#fff;}
#FooterImg
{color:#fff;
text-align: right;
font-size:80%;
position:absolute;
left:820px;
background:no-repeat;
display:block;}
/*Start Content Format*/
/*Paragraph Styles*/
h1,h2,h3,h4,h5,h6,h7
{font-family:Arial, Geneva, Verdana, sans-serif;
font-weight:600;}
h1
{color:#134679;
font-size:xx-large;
margin:0px;}
h2
{color:#CD3529;
font-size:x-large;}
h3
{color:#134679;
font-size:large;}
h4
{color:#CD3529;
font-size:medium;}
h5
{color:#134679;
font-size:small;}
h6
{color:#CD3529;
font-size:x-small;
font-style:normal;}
h7
{color:#000000;
font-size:xx-small;}
a
{color:#134679;}
a:hover
{color:#cd3529;
text-decoration:none;}
ul
{line-height:125%;
list-style:none;
margin-left:30px;
padding:0px;}
li
{line-height:125%;
list-style:disc;
margin:0px 0px 10px;
padding:0px;}
#HomeContent
{float:left;
width:603px;
padding:10px 10px 20px;
background-color:#fff;}
#HomeContent p
{line-height:150%;
color:#000;
margin-left:10px;
font-size:110%;}
#RightNav
{float:right;
width:210px;
color:#000;
background-color:transparent;
font-size:85%;
padding:0px 0px 0px 0px;
margin:0px;}
#InternalContent
{float:right; width:625px;}
#InternalContent p
{line-height:150%;
color:#000;
font-size:110%;
margin-left:10px;}
#InternalContent h1
{color:#134679;
font-size:xx-large;}
#InternalContent h2
{color:#CD3529;
font-size:x-large;}
#InternalContent h3
{color:#134679;
font-size:large;}
#InternalContent h4
{color:#CD3529;
font-size:medium;}
#InternalContent h5
{color:#134679;
font-size:small;}
#InternalContent h6
{color:#CD3529;
font-size:x-small;
font-style:normal;}
#InternalContent h7
{color:#000000;
font-size:xx-small;}
/*Table Styles*/
table#Contact td
{padding:5px;
vertical-align:top;}
.p
{line-height:125%;
color:#000;
margin-left:10px;
font-size:95%;}
.h2
{color:#CD3529;
font-size:large;}
.h3
{color:#134679;
font-size:medium;
font-weight:600;}
/*Character Styles*/
.Bold
{font-weight:600;}
.Bold1
{font-weight:600;
color:#CD3529;}
.Bold2
{font-weight:600;
color:#01447B;}
.Italic
{font-style:italic;}
.BoldItalic
{font-weight:600;
font-style:italic;}
.Captions
{font-size:10pt;}
.ImageBorder
{border:#01447B solid 2px;}
.Bullets li {background:url("/I[/CODE]mages/TemplateImages/Bullet.png") no-repeat; background-position:inherit; padding:0px 0px 5px 40px; line-height:1.5em; list-style:none;}
/*Inserts Spaces between elements, use as DIV tags, put an
between the div id tag and div closing tag - Small Spacers = 1 line. Med Spacers = 2 lines, large spacers=3 lines, xl Spacers = 4 lines */
#SmSpacer
{padding:5px;}
#SmSpacer1
{padding:5px;}
#SmSpacer2
{padding:5px;}
#SmSpacer3
{padding:5px;}
#SmSpacer4
{padding:5px;}
#MedSpacer
{padding:10px;}
#MedSpacer1
{padding:10px;}
#MedSpacer2
{padding:10px;}
#MedSpacer3
{padding:10px;}
#MedSpacer4
{padding:10px;}
#MedSpacer
{padding:10px;}
#LgSpacer
{padding:15px;}
#LgSpacer1
{padding:15px;}
#LgSpacer2
{padding:15px;}
#LgSpacer3
{padding:15px;}
#LgSpacer4
{padding:15px;}
#XLSpacer
{padding:20px;}
#XLSpacer1
{padding:20px;}
#XLSpacer2
{padding:20px;}
#XLSpacer3
{padding:20px;}
#XLSpacer4
{padding:20px;}
/*Boxes - Use these to insert feature boxes on the Page */
/*Navigation Box - this box controls your navigation pieces on your internal pages. It floats to the left. Inserting bullets in this box will give each line a solid round bullet, and links will appear in blue.*/
#Navigation
{background-color:#ddd;
color:black;
border-top:1px solid #01447B;
border-bottom:1px solid #01447B;
border-right:1px solid #01447B;
border-left:1px solid #01447B;
width:200px;
float:left;
margin-bottom:5px;
margin-top:5px;
margin-right:7px;}
#Navigation h1
{padding-left:2px;
margin:2px;
padding-bottom:2px;
line-height:135%;
font-weight:600;
color:#CD3529;
font-size:small;}
#Navigation p
{padding-left:5px;
margin:2px;
line-height:135%}
#Navigation ul
{padding-left:15px;
margin:2px;
line-height:135%;
list-style:disc}
#Navigation a
{color:#01447B;
text-decoration:underline;}
/*Box1 has a white background, with a 1 px solid border. Inserting a h1 in this box will allow the h1 line to have a light red background with the text in black. This Box floats to the right of content. */
#Box1
{background-color:#fff;
color:black;
border:1px solid #333;
margin-bottom:10px;
margin-top:10px;
width:200px;
float:right;
margin-left:7px;}
#Box1 h1
{color:#000;
font-size:14px;
background-color:#D6AEAA;
padding:0px;
margin-bottom:10px;
margin-top:0px;
padding:2px;
text-align:center;}
#Box1 h2
{color:#000;
font-size:16px;
font-weight:600;
padding-left:4px;}
#Box1 p
{padding-left:7px;
margin:5px;
line-height:135%}
#Box a
{color:#01447B;
text-decoration:none;}
/*Box2* has a white background with a 1px solid border. Inserting an image in this box will float it left, and give it a little space between the image and the box edge. This Box floats to the right of content.*/
#Box2
{background-color:#fff;
color:black;
border:1px solid #333;
width:200px;
margin-bottom:5px;
margin-top:5px;
float:right;
margin-left:7px;}
#Box2 p
{padding-left:5px;
margin:2px;
line-height:135%}
#Box2 img
{float:right;
padding-right:5px;}
/*Box3* allows you to post an image in the box without and space around it the paragraphs in this box do not have any extra space between them. This Box floats to the right of content.*/
#Box3
{background-color:#fff;
color:black;
border:1px solid #333;
width:200px;
float:right;
margin-bottom:5px;
margin-top:5px;
margin-left:7px;}
#Box3 img
{padding-bottom:5px;}
#Box3 p
{padding-left:5px;
margin:2px;
line-height:135%}
{background-color:#fff;
width:205px;
float:right;
margin-bottom:5px;
margin-top:5px;
margin-left:7px;}