Combining Styles

Hi All

If I had the following 3 style in a CSS file
<style>
.bordered {border: red thin soldid;}
.warning {background-color: #900;}
.box {padding: 5%; text-align:justify;}
</style>


Then in my html page I can do somthing like this:
<div class="box warning bordered">This is a warning.</div>

is there a way to "combined" the 3 styles into a 4th one eg:
<style>
.mywarning {box; warning; bordered}
</style>

so I can do things like this:
<div class="mywarning">This is a warning.</div>

and also still use the 3 original styles like:
<div class="bordered">a border around me</div>


Thanks for any help/tips

Al.

In article <vc82qv829me2n76dbilscqsnu58t2kb342 (AT) 4ax (DOT) com> in
comp.infosystems.www.authoring.stylesheets, Harag
<harag (AT) softGETRIDOFCAPLETTERShome (DOT) net> wrote:

is there a way to "combined" the 3 styles into a 4th one eg:
<style
.mywarning {box; warning; bordered}
</style

No. There is no way in plain CSS to make a new class include the
properties of existing classes. Some sort of preprocessor could
probably do the job.

--
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/

*Harag* <harag (AT) softGETRIDOFCAPLETTERShome (DOT) net>:

.bordered {border: red thin soldid;}
.warning {background-color: #900;}
.box {padding: 5%; text-align:justify;}

is there a way to "combined" the 3 styles into a 4th one

.mywarning, .bordered {border: red thin soldid;}
.mywarning, .warning {background-color: #900;}
.mywarning, .box {padding: 5%; text-align:justify;}

Virtually every CSS tutorial would have told you that in its "Selectors"
chapter.

--
Alcohol didn't cause the high crime rates of the '20s and '30s, Prohibition did.
And drugs do not cause today's alarming crime rates, but drug prohibition does.
(US District Judge James C. Paine, November 1991)

In article <bo1mgf$75q$1 (AT) ariadne (DOT) rz.tu-clausthal.de> in
comp.infosystems.www.authoring.stylesheets, Christoph Paeper
<crissov2003Q4 (AT) gmx (DOT) net> wrote:

.mywarning, .bordered {border: red thin soldid;}

Shouldn't that be "sordid"? :-)

--
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/

I'm dont think you quite understand what I was after.

I don't want to redefine "bordered, warning & Box" I just want to use
them in one class.

if I have in one css fiile "FX.css"
..Bordered {border: red thin solid;}
..bgCCC {background-color: #CCC;}
..bg00C {background-color: #00C;}
..bg0C0 {background-color: #0C0;}
..bgC00 {background-color: #C00;}
..Box {padding: 5%; text-align:justify;}

I want to beable to define things like
..Warning {Bordered; bgC00; Box
..Note {bg00C; Box}

then in my html i can do:
<div class="Warning">this is a warning</div>

instead of:
<div class="Box Bordered bgC00">this is a warning</div>

if I want to change the background color of warnings throughout the
page then I can just edit the ".Warning {Bordered, bgC00, Box)" and
change it to ".Warning {Bordered, bgCCC, Box)" rather than edit every
DIV on the page where the warning is used.

Hope this is made clearer.

Al.


On Sun, 2 Nov 2003 02:26:41 +0100, Christoph Paeper
<crissov2003Q4 (AT) gmx (DOT) net> wrote:

*Harag* <harag (AT) softGETRIDOFCAPLETTERShome (DOT) net>:

.bordered {border: red thin soldid;}
.warning {background-color: #900;}
.box {padding: 5%; text-align:justify;}

is there a way to "combined" the 3 styles into a 4th one

.mywarning, .bordered {border: red thin soldid;}
.mywarning, .warning {background-color: #900;}
.mywarning, .box {padding: 5%; text-align:justify;}

Virtually every CSS tutorial would have told you that in its "Selectors"
chapter.

In article Harag wrote:

I'm dont think you quite understand what I was after.

I don't want to redefine "bordered, warning & Box" I just want to use
them in one class.

if I have in one css fiile "FX.css"
.Bordered {border: red thin solid;}
.bgCCC {background-color: #CCC;}
.bg00C {background-color: #00C;}
.bg0C0 {background-color: #0C0;}
.bgC00 {background-color: #C00;}
.Box {padding: 5%; text-align:justify;}

I want to beable to define things like
.Warning {Bordered; bgC00; Box
.Note {bg00C; Box}

That is not possible using CSS.

then in my html i can do:
div class="Warning">this is a warning</div

instead of:
div class="Box Bordered bgC00">this is a warning</div

if I want to change the background color of warnings throughout the
page then I can just edit the ".Warning {Bordered, bgC00, Box)" and
change it to ".Warning {Bordered, bgCCC, Box)" rather than edit every
DIV on the page where the warning is used.

You might want to use some server side language.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

*Harag* <harag (AT) softGETRIDOFCAPLETTERShome (DOT) net>:

I'm dont think you quite understand what I was after.

Be assured I did.

I don't want to redefine "bordered, warning & Box" I just want to use
them in one class.

Because that is not possible the way you want it, I showed you the way it is
possible with CSS. The result is virtually the same.

--
"Opportunity is missed by most people
because it is dressed in overalls and looks like work."
Thomas Alva Edison