Opposite of display:none ?

Right now I have separate style sheets for screen and print, but of
course there's a lot of duplication between them. I'd like to
consolidate them into one style sheet for all media, with specific
@media rules for the stuff that is different for print.

One thing has me stumped, though: certain elements should be visible
only on print. So the style sheet specifies class .onlyprint as
display:none. But then how do I override that for print media? I
don't want to list a rule for each element to set them to inline,
block, and so on.

..onlyprint { display: none }

@media print {
.onlyprint { display: ???????? }
}

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You:
http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you

Gazing into my crystal ball I observed Stan Brown
<the_stan_brown (AT) fastmail (DOT) fm> writing in news:MPG.24ceed528d4d8ddc98bb75
@news.individual.net:

Right now I have separate style sheets for screen and print, but of
course there's a lot of duplication between them. I'd like to
consolidate them into one style sheet for all media, with specific
@media rules for the stuff that is different for print.

One thing has me stumped, though: certain elements should be visible
only on print. So the style sheet specifies class .onlyprint as
display:none. But then how do I override that for print media? I
don't want to list a rule for each element to set them to inline,
block, and so on.

.onlyprint { display: none }

@media print {
.onlyprint { display: ???????? }
}

Perhaps .onlyprint {display:block;}

AFAIK, the browser will automatically show the element. Here's what I
do:

#content {width:80%;}

@media print
{
#header, #nav, #footer {display:none}
#content {width:100%;}
}

--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

On Mon, 20 Jul 2009 22:09:12 -0400
Stan Brown <the_stan_brown (AT) fastmail (DOT) fm> wrote:

Right now I have separate style sheets for screen and print, but
of course there's a lot of duplication between them. I'd like to
consolidate them into one style sheet for all media, with
specific @media rules for the stuff that is different for print.

One thing has me stumped, though: certain elements should be
visible only on print. So the style sheet specifies class
.onlyprint as display:none. But then how do I override that for
print media? I don't want to list a rule for each element to set
them to inline, block, and so on.

.onlyprint { display: none }

@media print {
.onlyprint { display: ???????? }
}

If you wish to hide it from every media except print then simply do
that.

<link rel="stylesheet" href="/temo.css" type="text/css"
media="aural,braille,embossed,handheld,projection, screen,tty,tv">

<style type="text/css"
media="aural,braille,embossed,handheld,projection, screen,tty,tv">
..onlyprint {display:none;}
<style>

@import url("/temo.css")
aural,braille,embossed,handheld,projection,screen, tty,tv;

@media aural,braille,embossed,handheld,projection,screen, tty,tv {
..onlyprint{display:none;}
}



--
BootNic Mon Jul 20, 2009 11:43 pm
One must learn by doing the thing, for though you think you know it,
you have no certainty until you try.
*Aristotle*

⁕ 357 days remaining

-----BEGIN PGP SIGNATURE-----
Version: GnuPG v2.0.11 (GNU/Linux)

iEYEARECAAYFAkplOYIACgkQmo2774GZ7qkzgQCg5orJwh9GMl Ho/qqIXivU01s7
MZkAoJxXHVhYH51OLJP/NSXs2FP7qs9y
=RXcV
-----END PGP SIGNATURE-----

Stan Brown wrote:

Right now I have separate style sheets for screen and print, but of
course there's a lot of duplication between them. I'd like to
consolidate them into one style sheet for all media, with specific
@media rules for the stuff that is different for print.

One thing has me stumped, though: certain elements should be visible
only on print. So the style sheet specifies class .onlyprint as
display:none. But then how do I override that for print media? I
don't want to list a rule for each element to set them to inline,
block, and so on.

Why don't you look at the CSS spec. Or any good CSS book.

(Hint: there is no single opposite to display:block)

Stan Brown wrote:

Right now I have separate style sheets for screen and print, but of
course there's a lot of duplication between them. I'd like to
consolidate them into one style sheet for all media, with specific
@media rules for the stuff that is different for print.

One thing has me stumped, though: certain elements should be visible
only on print. So the style sheet specifies class .onlyprint as
display:none. But then how do I override that for print media? I
don't want to list a rule for each element to set them to inline,
block, and so on.

Do it the other way round.

@media screen {
..onlyprint { display: none }
}

@media print {

..onlyprint { /* dont say anything */}
}

Tue, 21 Jul 2009 00:15:44 -0400 from C A Upsdell
<cupsdell (AT) nospam (DOT) not>:

Why don't you look at the CSS spec.

Thank you. I did -- which is why I posted my question.

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You:
http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you

Tue, 21 Jul 2009 09:22:30 GMT from rf <rf@z.invalid>:

Stan Brown wrote:
One thing has me stumped, though: certain elements should be
visible only on print. So the style sheet specifies class
.onlyprint as display:none. But then how do I override that for
print media? I don't want to list a rule for each element to set
them to inline, block, and so on.

Do it the other way round.

@media screen {
.onlyprint { display: none }
}

@media print {
.onlyprint { /* dont say anything */}
}

That would work if the only two media were print and screen. But the
spec lists about a dozen, and even worse it says that there may be
others. So how do I say "display:none" for every medium except
print? There must be a way, but I'm not finding it in the spec.

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You:
http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you

Tue, 21 Jul 2009 02:43:25 +0000 (UTC) from Adrienne Boswell
<arbpen (AT) yahoo (DOT) com>:

Gazing into my crystal ball I observed Stan Brown
the_stan_brown (AT) fastmail (DOT) fm> writing in news:MPG.24ceed528d4d8ddc98bb75
@news.individual.net:
One thing has me stumped, though: certain elements should be
visible only on print. So the style sheet specifies class
.onlyprint as display:none. But then how do I override that for
print media? I don't want to list a rule for each element to set
them to inline, block, and so on.

.onlyprint { display: none }

@media print {
.onlyprint { display: ???????? }
}


Perhaps .onlyprint {display:block;}

Thanks, Adrienne. But what happens when I do a <span.onlyprint>? I
don't want to turn inline elements into block elements.

Here's what I do:

#content {width:80%;}

@media print
{
#header, #nav, #footer {display:none}
#content {width:100%;}
}

Right, I understand that. My problem is when I want diskpal:none on
all media *except* print. There are too many in the spec to list,
and the spec itself says that there may be other media types.

Or should I just not worry about anything but screen and print and
maybe projection?

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You:
http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you

On Jul 21, 5:22*am, "rf" <r...@z.invalid> wrote:

Stan Brown wrote:

Do it the other way round.

@media screen {
.onlyprint { display: none }}

*@media print {
.onlyprint { /* dont say anything */}

Why does one have to define .onlyprint for print media? If it is
only defined for screen then the class will be ignored for print. Am
I missing something?

www.richardfisher.com

Helpful person wrote:

On Jul 21, 5:22 am, "rf" <r...@z.invalid> wrote:
Stan Brown wrote:

Do it the other way round.

@media screen {
.onlyprint { display: none }}

@media print {
.onlyprint { /* dont say anything */}

Why does one have to define .onlyprint for print media? If it is
only defined for screen then the class will be ignored for print. Am
I missing something?

You're right. Stan put it there, with the comment, for explanatory purposes.