different style sheets for screen/printing?

[Geoff Cox]

Hello,

I publish some web pages using large fonts and would like to give the
user the opportunity to print the pages using a smaller font.

I believe that this is possible using different style sheets? I am not
clear how the user would select the different .css files?

Seems to be easier than having duplicate html files ...

Appreciate any help!

Cheers

Geoff

[Martin Honnen]

Re: different style sheets for screen/printing?



Geoff Cox wrote:[color=blue]
> I publish some web pages using large fonts and would like to give the
> user the opportunity to print the pages using a smaller font.
>
> I believe that this is possible using different style sheets? I am not
> clear how the user would select the different .css files?[/color]

There is no need for you to select a different CSS file, rather specify
the media in the <link> element
<link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
<link rel="stylesheet " media="print" type="text/css" href="print.css ">

--

Martin Honnen

http://JavaScript.FAQTs.com/

[Geoff Cox]

Re: different style sheets for screen/printing?

On Thu, 16 Oct 2003 12:09:29 +0200, Martin Honnen <mahotrash@yaho o.de>
wrote:
[color=blue]
> <link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
> <link rel="stylesheet " media="print" type="text/css" href="print.css ">[/color]

Martin,

I'm a little lost here! I have added the above 2 lines using my 2
different .css files but when I go for print from the browser the
larger font text is printed ... Am I missing something here?!

Cheers

Geoff

[Martin Honnen]

Re: different style sheets for screen/printing?



Geoff Cox wrote:
[color=blue]
> On Thu, 16 Oct 2003 12:09:29 +0200, Martin Honnen <mahotrash@yaho o.de>
> wrote:[color=green]
>> <link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
>> <link rel="stylesheet " media="print" type="text/css" href="print.css ">[/color]
>
> I'm a little lost here! I have added the above 2 lines using my 2
> different .css files but when I go for print from the browser the
> larger font text is printed ... Am I missing something here?![/color]

I don't see anything wrong with the suggested lines.
Which browser are you using? Browsers like IE6/Win, Netscape 7 or Opera
7 should certainly support the stylesheet for print media, older
browsers like Netscape 4 don't support that.

--

Martin Honnen

http://JavaScript.FAQTs.com/

[Beauregard T. Shagnasty]

Re: different style sheets for screen/printing?

Geoff Cox pounced upon this pigeonhole and pronounced:[color=blue]
> On Thu, 16 Oct 2003 12:09:29 +0200, Martin Honnen <mahotrash@yaho o.de>
> wrote:
>[color=green]
> > <link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
> > <link rel="stylesheet " media="print" type="text/css" href="print.css ">[/color]
>
> Martin,
>
> I'm a little lost here! I have added the above 2 lines using my 2
> different .css files but when I go for print from the browser the
> larger font text is printed ... Am I missing something here?![/color]

For each element in the screen css, you must have a corresponding element
in the print css, with a smaller size specified, at least for the elements
you want to be different.

h1 { font-size: 160%; } in the screen css

h1 { font-size: 140%; } in the print css

--
-bts
-This space intentionally left blank.

[Andreas Prilop]

Re: different style sheets for screen/printing?

On Thu, 16 Oct 2003, Geoff Cox wrote:
[color=blue]
> I publish some web pages using large fonts[/color]

If you mean that you specify a font size for BODY - don't do that!
[color=blue]
> and would like to give the
> user the opportunity to print the pages using a smaller font.[/color]

Just let the reader decide about typeface and font size for BODY.

[Geoff Cox]

Re: different style sheets for screen/printing?

On Thu, 16 Oct 2003 14:09:44 +0200, Martin Honnen <mahotrash@yaho o.de>
wrote:
[color=blue]
>
>
>Geoff Cox wrote:
>[color=green]
>> On Thu, 16 Oct 2003 12:09:29 +0200, Martin Honnen <mahotrash@yaho o.de>
>> wrote:[color=darkred]
>>> <link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
>>> <link rel="stylesheet " media="print" type="text/css" href="print.css ">[/color]
>>
>> I'm a little lost here! I have added the above 2 lines using my 2
>> different .css files but when I go for print from the browser the
>> larger font text is printed ... Am I missing something here?![/color]
>
>I don't see anything wrong with the suggested lines.
>Which browser are you using? Browsers like IE6/Win, Netscape 7 or Opera
>7 should certainly support the stylesheet for print media, older
>browsers like Netscape 4 don't support that.[/color]

You are quite riight ! I must have made an error somewhere.

Thanks

Geoff

[Tim]

Re: different style sheets for screen/printing?

Martin Honnen <mahotrash@yaho o.de>
[color=blue][color=green]
>> <link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
>> <link rel="stylesheet " media="print" type="text/css" href="print.css ">[/color][/color]


Geoff Cox <geoff.cox@blue yonder.co.uk> wrote:
[color=blue]
> I'm a little lost here! I have added the above 2 lines using my 2
> different .css files but when I go for print from the browser the
> larger font text is printed ... Am I missing something here?![/color]

Those lines go into your HTML document, in the head section. Instead of
one stylesheet link, you're providing alternatives.

Alternatively, you could reference one style sheet in your HTML, and use
@ rules inside it, to do sections for different types of media.

A visit to the CSS specifications webpages would help you.

Such as here: <http://www.w3.org/TR/REC-CSS2/>

--
My "from" address is totally fake. (Hint: If I wanted e-mails from
complete strangers, I'd have put a real one, there.) Reply to usenet
postings in the same place as you read the message you're replying to.

[Geoff Cox]

Re: different style sheets for screen/printing?

On Thu, 16 Oct 2003 15:41:40 +0200, Andreas Prilop
<nhtcapri@rrz n-user.uni-hannover.de> wrote:
[color=blue]
>On Thu, 16 Oct 2003, Geoff Cox wrote:
>[color=green]
>> I publish some web pages using large fonts[/color]
>
>If you mean that you specify a font size for BODY - don't do that![/color]

Andreas,

the point here is that the person who is paying me wished the pages to
be made like this...they are to be read by some people with visual
impairment and I guess not all would be aware of how to change the
font themselves?

Cheers

Geoff
[color=blue]
>[color=green]
>> and would like to give the
>> user the opportunity to print the pages using a smaller font.[/color]
>
>Just let the reader decide about typeface and font size for BODY.[/color]

[Geoff Cox]

Re: different style sheets for screen/printing?

On Fri, 17 Oct 2003 00:13:42 +0930, Tim <admin@sheerhel l.lan> wrote:
[color=blue]
>Martin Honnen <mahotrash@yaho o.de>
>[color=green][color=darkred]
>>> <link rel="stylesheet " media="screen" type="text/css" href="screen.cs s">
>>> <link rel="stylesheet " media="print" type="text/css" href="print.css ">[/color][/color]
>
>
>Geoff Cox <geoff.cox@blue yonder.co.uk> wrote:
>[color=green]
>> I'm a little lost here! I have added the above 2 lines using my 2
>> different .css files but when I go for print from the browser the
>> larger font text is printed ... Am I missing something here?![/color]
>
>Those lines go into your HTML document, in the head section. Instead of
>one stylesheet link, you're providing alternatives.
>
>Alternativel y, you could reference one style sheet in your HTML, and use
>@ rules inside it, to do sections for different types of media.[/color]

Tim,

I will follow this up. Thanks.

If I wish to allow the user to select which font size to print in, I
will need to provide a duplicate html page in the different font size?

css cannot cover this?

Geoff
[color=blue]
>
>A visit to the CSS specifications webpages would help you.
>
>Such as here: <http://www.w3.org/TR/REC-CSS2/>[/color]

[Brian]

Re: different style sheets for screen/printing?

Geoff Cox wrote:[color=blue]
>
> the point here is that the person who is paying me wished the pages to
> be made like this...they are to be read by some people with visual
> impairment and I guess not all would be aware of how to change the
> font themselves?[/color]

So someone who is visually impaired has not already set a font-size to
something readable? How do they read any other pages?

--
Brian
follow the directions in my address to email me

[Thor Kottelin]

Re: different style sheets for screen/printing?



Geoff Cox wrote:[color=blue]
>
> On Thu, 16 Oct 2003 15:41:40 +0200, Andreas Prilop
> <nhtcapri@rrz n-user.uni-hannover.de> wrote:
>[color=green]
> >On Thu, 16 Oct 2003, Geoff Cox wrote:
> >[color=darkred]
> >> I publish some web pages using large fonts[/color]
> >
> >If you mean that you specify a font size for BODY - don't do that![/color][/color]
[color=blue]
> the point here is that the person who is paying me wished the pages to
> be made like this...they are to be read by some people with visual
> impairment and I guess not all would be aware of how to change the
> font themselves?[/color]

People with visual impairment are one of the reasons *not* to screw with
font sizes.

Thor

--

http://thorweb.anta.net/

[Geoff Cox]

Re: different style sheets for screen/printing?

On Thu, 16 Oct 2003 15:58:37 GMT, Brian
<usenet1@mangym utt.com.invalid-remove-this-part> wrote:
[color=blue]
>Geoff Cox wrote:[color=green]
>>
>> the point here is that the person who is paying me wished the pages to
>> be made like this...they are to be read by some people with visual
>> impairment and I guess not all would be aware of how to change the
>> font themselves?[/color]
>
>So someone who is visually impaired has not already set a font-size to
>something readable? How do they read any other pages?[/color]

You are probably right for most people ..

Geoff

[Brian]

Re: different style sheets for screen/printing?

Geoff Cox wrote:[color=blue]
>
> If I wish to allow the user to select which font size to print in, I
> will need to provide a duplicate html page in the different font size?[/color]

Heavens no!
[color=blue]
> css cannot cover this?[/color]

It can. In fact, done properly, it is the best way to handle font-size.

body {font-size: 100%}
/* sets the font size for the body element to 100% */
/* of the size the user has set in her or his browser */

h1 {font-size: 200%}
/* sets h1 element to twice the size of body text */

h2 {font-size: 150%}
/* sets h2 element to be 50% larger than body text */

h3 {font-size: 120%}
/* sets h3 element to be 20% larger than body text */


As others have said before, users are likely to be in one of two
groups: (1) those who have set their font size in their browser to
something that they like, and won't appreciate you changing it; and
(2) those who use the font-size set by the browser when it was
installed, and don't want to change it. For both groups, the only
sensible option is to always set the font-size of the body element to
100%. Set other elements to whatever size works given your size, but
always as a percent of the body element, that is, a percent of the
default size selected in the users' browsers.

hth

--
Brian
follow the directions in my address to email me

[Stan Brown]

Re: different style sheets for screen/printing?

In article <2bpsov072gqtkf ep0vl21aflngikv ee3cu@4ax.com> in
comp.infosystem s.www.authoring.html, Geoff Cox
<geoff.cox@blue yonder.co.uk> wrote:[color=blue]
>Hello,
>
>I publish some web pages using large fonts and would like to give the
>user the opportunity to print the pages using a smaller font.
>
>I believe that this is possible using different style sheets? I am not
>clear how the user would select the different .css files?[/color]

Good news! If you set it up right, the user doesn't have to do
anything. The key, as you suspect, is to link to separate screen and
print style sheets. (You could also use @media in a single style
sheet, but browser support is less good.)

Here's how I do it:[color=blue]
> <link rel="stylesheet " type="text/css" href="../screen.css" media="screen, projection">
> <link rel="stylesheet " type="text/css" href="../print.css" media="print">[/color]

You can see this in action at a page like[color=blue]
> http://www.acad.sunytccc.edu/instruc...t/normcalc.htm[/color]
Note the colored background for headings like "Percentile s", and the
extra margin at the left for body text. Then try Print (or Print
Preview), and see how the appearance changes.

That said, you probably ought to think twice about setting any
absolute text sizes in either your print or your screen style sheet.
Users already have both of those set to values that are comfortable
for them. Good practice is to set font sizes in percentages,
relative to the user's chosen size for body text. The above style
sheets illustrate that.

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA

http://OakRoadSystems.com/

HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/