...

View Full Version : @media print seams broken



agrothe
07-27-2007, 05:17 PM
I'm trying to get the @media style to work, so basically i've made a full copy of my stylesheet but renamed it and added this to my html:
<LINK REL="stylesheet" TYPE="text/css" MEDIA="print, handheld" HREF="/inc/doprint.css" />

then, in each and ever style i've put "display: none;".

From what I read, my print preview should be blank. It hasn't changed a bit however.

Am I missing something simple here?

_Aerospace_Eng_
07-27-2007, 05:18 PM
Can you post your doprint.css stylesheet? The html would be useful as well.

agrothe
07-27-2007, 05:22 PM
the html can be viewed here:
the doprint.css is very long, so i'll past a portion here:



body {
margin:0px;
padding:0px;
background-color: #ffffff;
text-align: center;
display: none;

display: none; }

#wrapper {

width: 766px;
margin-left: auto;
margin-right: auto;
text-align: left;
background-image:url(../images/content-bg.gif);
background-repeat: repeat-y;

display: none; }

#featured {

width:204px;
padding:200px 0px 0px 0px;
margin:0px 0px 0px 0px;
text-align: center;

display: none; }

#featured2 {

width:204px;
padding:50px 0px 0px 0px;
margin:80px 0px 0px 0px;
text-align: center;

display: none; }

#header {
height: 147px;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-image:url(../images/content-bg.gif);
background-repeat: repeat-y;
font-size:0;
position: static;

display: none; }

#nav {
height: 34px;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-image: url(../images/domoretravel-navbg.gif);
background-repeat: no-repeat;
line-height: 0px;

display: none; }


h1 {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
padding: 0px 0px 0px 30px;
margin: 0px 0px 0px 0px;
color: #3c6491;
word-spacing: 2px;
border-bottom-width: 1px;

display: none; }

_Aerospace_Eng_
07-27-2007, 05:27 PM
You have this after your print stylesheet overriding everything before it because you haven't set the media for it.

<link rel="stylesheet" href="/inc/do.css" type="text/css" />
that should be

<link rel="stylesheet" href="/inc/do.css" media="screen" type="text/css" />
BTW your layout looks severely broken in Firefox 2.0.0.5

agrothe
07-27-2007, 05:35 PM
BTW your layout looks severely broken in Firefox 2.0.0.5

I know, its kinda weird as it looks fine on the kiosk which is where it's displayed to public.....

Thanks for that tip, I guess consistancy is good, however if you check the print preview it still isn't showing properly...

I'm a little frustrated as I can view other samples of this fine, but this page is just being fussy...

agrothe
07-27-2007, 05:41 PM
Basically, I'm trying to just print the information listed on the yellow # 3 on the left.

_Aerospace_Eng_
07-27-2007, 05:50 PM
It would help if you actually uploaded your stylesheet to the correct folder. The html document is looking for it here http://www.domoretravel.com/inc/doprint.css but its actually here
http://www.domoretravel.com/kiosk/domoretravel/inc/doprint.css
Remove the leading / in front of the href. The leading forward slash tells the document to look for whatever file at the root of the site.

agrothe
07-27-2007, 05:56 PM
man, it's always something stupid!!! no wonder you've got the helpful member award!

Consequently, my print stylesheet is now overriding my screen style sheet....

I'm just plagued i think.

_Aerospace_Eng_
07-27-2007, 06:06 PM
No its not. It doesn't help when you have display:none; in your do.css on the body.

agrothe
07-27-2007, 06:12 PM
Yeah, i caught that.

I've got the screen showing, now i've got Nothing displaying for print, so i'm working at that. Thanks for your quick replies Aerospace.

Do nested DIV tags get hidden too? for ex:
<DIV> - print hidden
<DIV> - print visible

Does the nested DIV get displayed or hidden?

_Aerospace_Eng_
07-27-2007, 06:13 PM
It gets hidden because the parent element is set to display:none. Did you by chance take over the site from/for someone else?

agrothe
07-27-2007, 06:18 PM
It gets hidden because the parent element is set to display:none. Did you by chance take over the site from/for someone else?

Why yes, thats exactly what happened. How could you tell????

<do i really need the sarcasm tags??>

agrothe
07-27-2007, 06:33 PM
Woot, I got it done.

I basically copied the nested DIV style to two new styles, create a copy of the DIVs i wanted to print at the bottom of the page, set screen to not display, print to display and BINGO!!

Aerospace_Eng, you are a proper genius and my heartfelt thanks. you have no idea how happy a man i am right now.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum