By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,599 Members | 1,678 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,599 IT Pros & Developers. It's quick & easy.

stylesheet with several <pre> styles?

P: n/a
How do I set several different properties for PRE in
a CSS stylesheet, rather than resorting to this:

<BODY>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width:40%;
border:red 2px solid;
color:red;
background-color:#FBB; ">
This is red
</PRE>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width: 40%;
border:blue 2px solid;
color:blue;
background-color:#BBF; ">
This is blue
</PRE>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width: 40%;
border:green 2px solid;
color:green;
background-color:#BFB; ">
This is green
</PRE>

</BODY>

(the above is just an example)

Regards,
Alan
--
A: Because it messes up the order in which people normally read text.
Q: Why is it such a bad thing?
A: Top-posting.
Q: What is the most annoying thing on usenet and in e-mail?

Jul 20 '05 #1
Share this Question
Share on Google+
7 Replies


P: n/a
Alan Illeman wrote:
How do I set several different properties for PRE in
a CSS stylesheet, rather than resorting to this:

<BODY>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width:40%;
border:red 2px solid;
color:red;
background-color:#FBB; ">
This is red
</PRE>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width: 40%;
border:blue 2px solid;
color:blue;
background-color:#BBF; ">
This is blue
</PRE>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width: 40%;
border:green 2px solid;
color:green;
background-color:#BFB; ">
This is green
</PRE>

</BODY>

(the above is just an example)

Regards,
Alan
--
A: Because it messes up the order in which people normally read text.
Q: Why is it such a bad thing?
A: Top-posting.
Q: What is the most annoying thing on usenet and in e-mail?


Would this do?

In CSS:
..pre1 {font-family:monospace;
font-size:0.95em;
width:40%;
border:red 2px solid;
color:red;
background-color:#FBB;}

And so on.

In Body
<pre class="pre1">This is red</pre>

--
Arne
http://w1.978.telia.com/~u97802964/
Jul 20 '05 #2

P: n/a
"Alan Illeman" <il******@surfbest.net> wrote:
How do I set several different properties for PRE in
a CSS stylesheet, rather than resorting to this:

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width:40%;
border:red 2px solid;
color:red;
background-color:#FBB; ">
This is red
</PRE>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width: 40%;
border:blue 2px solid;
color:blue;
background-color:#BBF; ">
This is blue
</PRE>

<PRE STYLE="font-family:monospace;
font-size:0.95em;
width: 40%;
border:green 2px solid;
color:green;
background-color:#BFB; ">
This is green
</PRE>


Specifying monospace is superfluous as it's the default for <pre>,
specifying 0.95em may also be pointless.

pre.special{width:40%}
pre.special.one{border:2px solid red;color:red;background:blue}
pre.special.two{border:2px solid green;color:green;background:red}
pre.special.three{border:2px solid blue;color:blue;background:green}

Replace the "special, one, two, three" class names with something
meaningful.

<pre class="special one">foobar</pre>
<pre class="special two">foobar</pre>
<pre class="special three">foobar</pre>

--
Spartanicus
Jul 20 '05 #3

P: n/a
On Sun, 8 Aug 2004 07:33:33 -0400, Alan Illeman wrote:
How do I set several different properties for PRE in
a CSS stylesheet, rather than resorting to this:
Several ways, the easiest is if there are no other
<PRE> sections..

<head>
....
<style type='text/css'>
pre {
// this is a default for <PRE> sections AFAIU, redundant..
// font-family:monospace;
font-size:0.95em;
width:40%;
// AFAIR, you can override *just* the color, see below..
border:black 2px solid;
}
</style>
</head>
<BODY>
<PRE STYLE="border-color:red; color:red;
background-color:#FBB; ">
This is red
</PRE>
etc..

[ ..And why are you presuming you can manually space
text so that it fits 40% of the width of the page?
(If that is what the spaces are for) ]
(the above is just an example)


...hmmm. I always get suspicious when people pose
arbitrary examples that they think demonstrate the
problem/challenge they face. An *actual* page with
a 'real World(WideWeb)' example is generally better.

For further information see..
<http://www.spartanicus.utvinternet.ie/help_us_help_you.htm>
...or my own variant more geared to Java/Javascript
<http://www.physci.org/codes/sscce.jsp>

HTH

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Jul 20 '05 #4

P: n/a

"Alan Illeman" <il******@surfbest.net> wrote in message
news:10*************@news.supernews.com...
How do I set several different properties for PRE in
a CSS stylesheet, rather than resorting to this:

<BODY>

<PRE STYLE="font-family:monospace;

[snip]

Thank you Arne.
Thank you Spartanicus
I prefer your solution
Thank you Andrew Thompson
It's hard to provide a webpage, when I don't have a solution!

Alan


Jul 20 '05 #5

P: n/a
Spartanicus wrote on 08 aug 2004 in
comp.infosystems.www.authoring.stylesheets:
Specifying monospace is superfluous as it's the default for <pre>,
specifying 0.95em may also be pointless.

pre.special{width:40%}
pre.special.one{border:2px solid red;color:red;background:blue}
pre.special.two{border:2px solid green;color:green;background:red}
pre.special.three{border:2px solid blue;color:blue;background:green}

Replace the "special, one, two, three" class names with something
meaningful.

<pre class="special one">foobar</pre>
<pre class="special two">foobar</pre>
<pre class="special three">foobar</pre>


should be:

pre.special{width:40%}
pre.one{border:2px solid red;color:red;background:blue}
pre.two{border:2px solid green;color:green;background:red}
pre.three{border:2px solid blue;color:blue;background:green}

IMHO.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jul 20 '05 #6

P: n/a
"Evertjan." <ex**************@interxnl.net> wrote:
pre.special{width:40%}
pre.special.one{border:2px solid red;color:red;background:blue}
pre.special.two{border:2px solid green;color:green;background:red}
pre.special.three{border:2px solid blue;color:blue;background:green}


should be:

pre.special{width:40%}
pre.one{border:2px solid red;color:red;background:blue}
pre.two{border:2px solid green;color:green;background:red}
pre.three{border:2px solid blue;color:blue;background:green}


There's no "should" about it, either method can be used.

--
Spartanicus
Jul 20 '05 #7

P: n/a

"Alan Illeman" <il******@surfbest.net> wrote in message
news:10*************@news.supernews.com...

"Alan Illeman" <il******@surfbest.net> wrote in message
news:10*************@news.supernews.com...
How do I set several different properties for PRE in
a CSS stylesheet, rather than resorting to this:

<BODY>

<PRE STYLE="font-family:monospace;

[snip]

Thank you Arne.
Thank you Spartanicus
I prefer your solution
Thank you Andrew Thompson
It's hard to provide a webpage, when I don't have a solution!

Alan


Both methods
http://surfbest.net/~il******@surfbe...t-css/pre.html

Regards,
Alan
Jul 20 '05 #8

This discussion thread is closed

Replies have been disabled for this discussion.