Please Help Me Understand A Printer-Friendly CSS....

[Prisoner at War]

Okay, I'd like to create a print-friendly website, so I've been
reading up on how to create print-friendly pages (without duplicating
my site, of course, by having separate versions of each page)....

Apparently one can use JavaScript or CSS for this....

Using CSS, it seems that the "trick" is to use * media="print" * in
the <linktag....

So if I have a hyperlink to a print-friendly page...um, well, what's
that, just the current webpage, only with "print.css" instead of
"default.cs s" in the <linktag??? If so, that would be just having a
duplicate copy of the whole site!

So that can't be how it works, right?

But then, how does it work??

What's that print-friendly hyperlink actually pointing to??

This must be so basic that no one bothers explaining it...but I'm
starting ~95% from scratch, here....

BTW, here's something from my print.css file that's not working for
some reason:

body {
background-color: #fff;
color: #000;
margin: 0;
padding: 40px;
font: normal 12pt/160% Georgia;
}

#header, #menu, #search, #footer {
display: none;
}

a:link, a:visited, a:active {
color: #000;
text-decoration: none;
}

#primarycontain er a:after {
content: " ( attr(href) ")";
font-size: 11pt;
}

img { display: none; }
That last img thinggy, I'm not so sure about, as well the show URL
thinggy right before it, but the others don't work and yet they look
100% proper to me! What's going on?? My footer still shows up, my
menu shows up, the searchbox shows up, hyperlinks are still underlined
and colored, etc.

ALL ADVICE MUCH APPRECIATED!!

[Jonathan N. Little]

Prisoner at War wrote:

I was wondering if there's a way to give the user a WYSISYG page, a
preview of the printout, independent of the operating system's own
print preview capability...ap parently it's possible; I'm getting the

Yeah, with most moder browser they have a "Print Preview" button. The
print stylesheet will be used to create the preview page, so there is
not need to duplicate this on your part...

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

[Prisoner at War]

On Apr 20, 6:22 pm, "Jonathan N. Little" <lws4...@centra l.netwrote:

>

Yeah, with most moder browser they have a "Print Preview" button. The
print stylesheet will be used to create the preview page, so there is
not need to duplicate this on your part...

Okay, I guess my question is "academic" or "moot" at this point, but
for the sake of intellectual curiosity I must reiterate: it was,
apparently, possible to get CSS to generate a webpage based on an
existing webpage.

So forget the "print-friendly" business, then, and let me ask: how
does one use CSS to generate another page based on one currently
viewed??

Again, I'm getting this notion from Simon Collison's 2006 "Beginning
CSS Web Development," page 323-4, if I'm reading it right (he even has
before-and-after photos of http://www.science-city.co.uk as
"proof")... .

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIOhttp://www.LittleWorks Studio.com

[Ben Bacarisse]

Prisoner at War <pr************ *@yahoo.comwrit es:

On Apr 20, 3:33 pm, Ed Mullen <e...@edmullen. netwrote:

>Prisoner at War wrote:

<SNIP>

Looking more closely I'm perplexed by that construct. Where's you get that?

#primarycontain er a:after {
content: " ( attr(href) ")";

This is (intended to be) CSS3 and should probably read:

content: " (" attr(href) ")";

No idea if there is any browser support for it yet. It seems
premature to suggesting as a solution to any real problem.

font-size: 11pt;

You got me on that construct. Never seen such a thing.

It's from Simon Collison's "Beginning CSS Web Development: From Novice
to Professional" (2006, Apress)...he doesn't explain it much since
it's on pages 323-4 and so probably assumes a high level of technical
know-how by then...

Acquired how? By reading someone else's book on CSS? A technical
book should explain its content -- you are being too kind in letting
the author off the hook.

BTW, on the whole "WISIWTG print version" thing, simply forget it.
Any link to such a thing is just a hack from the last century and the
attempt to anything in a browser that even gets close to the browser's
print preview in terms of accuracy or usefulness is doomed to
failure. Do the print media CSS, by all means, but what else could
you usefully add?

--
Ben.

[Prisoner at War]

On Apr 20, 7:37 pm, Ben Bacarisse <ben.use...@bsb .me.ukwrote:

>

This is (intended to be) CSS3 and should probably read:

content: " (" attr(href) ")";

Okay, to quote the book (pages 323-4):

It is...useful to actually print the URLs alongside mentioned websites
in certain sections of the page. Earlier we looked at how CSS can
generate content before and after an element using CSS pseudo-
elements...here , the :after pseudo-element is used to perform a
specific function after each hyperlink...we are targeting the
[primarycontaine r] column, ensuring links outside of this column are
not printed. Next, the selector seeks any links in this column as the
<aelement is declared. Finally, the :after pseudo-element is
declared, informing the browser that any links within the
[primarycontaine r] column are where this action should happen. The
value declared for the content property is a little more complex, but
it basically tells the browser to perform the action immediately after
the content, which is the attribute href, and to place the generated
content within brackets (which have to be surrounded with quotes)....

No idea if there is any browser support for it yet. It seems
premature to suggesting as a solution to any real problem.

Thing is, the book's copyrighted 2006! That must mean he wrote it in
2005!!

Acquired how? By reading someone else's book on CSS? A technical
book should explain its content -- you are being too kind in letting
the author off the hook.

I think technical books, even if they aren't meant to be strictly
reference texts, ought to have each section be more "self-contained"
than not, but seeing how I've just started the book yesterday and am
already skimming ahead to Chapter 14 out of like 16 altogether, I just
can't say if anyone's at "fault" here.

BTW, on the whole "WISIWTG print version" thing, simply forget it.
Any link to such a thing is just a hack from the last century and the
attempt to anything in a browser that even gets close to the browser's
print preview in terms of accuracy or usefulness is doomed to
failure. Do the print media CSS, by all means, but what else could
you usefully add?

Ah, well, since I'm just learning right now, it's all very interesting
just for something to be possible, whatever its utility! I mean, one
could also include "javascript:sel f.print()" in a "print this"
hyperlink even though practically everyone would know how to print a
webpage...but it was very interesting in itself to know that such a
thing can be done.

--
Ben.

[Ben Bacarisse]

Prisoner at War <pr************ *@yahoo.comwrit es:

On Apr 20, 7:37 pm, Ben Bacarisse <ben.use...@bsb .me.ukwrote:

>>
This is (intended to be) CSS3 and should probably read:

content: " (" attr(href) ")";

Okay, to quote the book (pages 323-4):

No, you are quite right. I misread a document title! The attr()
syntax is in CSS 2 and 2.1. IE6 support is missing (which why one
does not see this used much) but that does not mean it is not
"current" CSS.

<snip>

Thing is, the book's copyrighted 2006! That must mean he wrote it in
2005!!

OK, but there were drafts of lots of CSS3 before then. No excuse for
my getting it wrong, but the date is not the issue.

<snip>

Ah, well, since I'm just learning right now, it's all very interesting
just for something to be possible, whatever its utility! I mean, one
could also include "javascript:sel f.print()" in a "print this"
hyperlink even though practically everyone would know how to print a
webpage...but it was very interesting in itself to know that such a
thing can be done.

The problem is the whole idea of "such a thing" (WYSIWYG print preview
in browser window). It is ill-defined and even those bits where one
can make a stab at defining the "expected" behaviour, CSS has no hope
of even getting close to doing it.

Even the rather limited "change the page so links include the text of
the href attribute" can't be done in a cross-browser way (yet).

--
Ben.

[Prisoner at War]

On Apr 20, 8:36 pm, Ben Bacarisse <ben.use...@bsb .me.ukwrote:

>

<SNIP>

The problem is the whole idea of "such a thing" (WYSIWYG print preview
in browser window). It is ill-defined and even those bits where one
can make a stab at defining the "expected" behaviour, CSS has no hope
of even getting close to doing it.

Even the rather limited "change the page so links include the text of
the href attribute" can't be done in a cross-browser way (yet).

Well, that's precisely the matter at hand: can it, or not? The book
seems to say it's possible...I mean, it had two pictures of the site,
a before and after, both within the Apple Safari web browser (though,
curiously, no URL field), which seems to suggest such a WYSIWYG page
possible. So I'm really puzzled how that could be, how CSS could be
used to generate a page based on another page.

If it's actually not possible, then those two photos were really
misleading, especially in their before-and-after placement. Being
inside browser windows, it seemed to suggest that the code the author
provided could "dynamicall y" create a "stand-alone" WYSIWYG print-page
in the browser....

Ugh, I think I will just go back to website content-creation as
opposed to structural-construction and tweaking...bleh ....

--
Ben.