Click to See Complete Forum and Search --> : Getting this stylesheet right is making me crazy /HELP!!


Howard Karten
11-12-2004, 02:54 PM
I hope there is kind soul here who can help me with two aspects of a stylesheet. It works properly "mostly" , except for two problems I'm having with it.

Problem # 1: it displays and prints properly in Firefox. But in MSIE 6.0, tho it displays properly, the printed page is missing approximately the right-most 2 inches or so. Is there any way to make it print properly in both browsers? Or is this just one of those damnable incompatabilities/shortcomings of MSIE?

Problem # 2: What do I have to do to regulate the size of the printed page, in particular, to make it narrower or wider? Note that I;ve given the entire document the ID "wholedocu". I tried changing the measurements specified below, making them wider and narrower, but they did not affect the appearance of the printed page.

Here is the entire stylesheet, and an excerpt from the <body>.

==============================

<style media="print" type="text/css">

@page wholedocu {size: 8.5in 11in; margin: 1in 1in 1 in 1in; marks: crop; }

p.margin {margin: 5m 5cm 5cm 5cm;}

.box { BACKGROUND: yellow;
MARGIN-LEFT: 1 em;
border-top: 2px solid;
border-bottom: 2px solid;
border-left: 2px solid;
border-right: 2px solid;
COLOR: #990000;
FONT-FAMILY: Comic Sans MS, Arial, Tahoma, Times New Roman ;
FONT-SIZE: 10pt;
padding: 2;
TEXT-ALIGN: left; }

.body { BACKGROUND: white;
COLOR: black;
FONT-FAMILY: Times New Roman, Times, serif ; FONT-SIZE: 12pt;
TEXT-ALIGN: left; }

box
{ font-family: "comic cans ms", arial, 'sans serif';
margin-left: 5pt;
margin-right: 5pt;
}

</style>

<style media="screen" type="text/css">

p.margin { margin: 5cm 5cm 5cm 5cm; }

.box { BACKGROUND: yellow;
MARGIN-LEFT: 1 em;
border-top: 2px solid;
border-bottom: 2px solid;
border-left: 2px solid;
border-right: 2px solid;
COLOR: #990000;
FONT-FAMILY: Comic Sans MS, Arial, Tahoma, Times New Roman ;
FONT-SIZE: 10pt;
padding: 2;
TEXT-ALIGN: left; }

.body { BACKGROUND: white;
COLOR: black;
FONT-FAMILY: Times New Roman, Times, serif ; FONT-SIZE: 12pt;
TEXT-ALIGN: left; }

<!-- no period preceeding box!! -->

box
{ font-family: "comic cans ms", arial, 'sans serif';
margin-left: 5pt
margin-right: 5pt
}

</style>

[snip]

<div id=wholedocu>
<font face="Times new roman, arial, helvetica" size=3>


<div class=body>

<P> Here is one line of the document. Here are some extra lines
to make sure that it will extend to several lines of print. blah
blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah blah blah blah blah blah
blah blah </P>

<P>A second paragraph: blah blah blah </P>

</div> [end of the box division.]

<div class=box>

<P> This line goes in a box. The box comes out properly in every
detail: the background is yellow, the font is Comic Sans MS,
and there is a box around it. blah blah blah blah blah </P>


</div> [this is the end of the BOX division.]

</div> [this is the end of the wholedocu division.]

David Harrison
11-12-2004, 06:29 PM
Well, rather than setting the size of the paper, I think it would be better if instead you use %'s to determine the width. Here in the UK we mainly use A4 paper and in the US you use a different standard and size.

A4 paper is 210mm by 297mm.
The paper size you have specified (including margins) is 26.67mm by 33.02mm.

As you can see, it's like trying to ift a square peg in a round hole.

Howard Karten
11-13-2004, 06:48 AM
....and are you aware of any site that has a set of examples which could be studied and modified as necessary?

David Harrison
11-13-2004, 10:59 AM
Sorry, I don't know of any. I've never tried to learn about print media styles so I don't know of any online resources. You could try asking in the CSS forum, I'm sure that someone in there will know.