Re: Giving a class the same values as another class

Yes and no.  This works, depending on what you are trying to do.  For the case
I'm pointing out, I would like a local style to have the same values as a global
style.  Your suggestion would mean overwriting or adding to the global style
(for that page only).  In many cases, this would be sufficient.  But what about
the case where you don't want to apply this style to evey item with the global
style?  For example, suppose I have two groups of <TD> tags containing very
different items.  I want them to have the global site styles applied, but each
group also has its own unique styles to apply as well.  If I simply change style
as you suggested, the change would be applied to both groups.  Take this for
example:

/* site.css */
/* This is a global style, used throughout the site */
.globalproperties { font-family: helvetica,sans-serif; }



<html>
<head>
<title>Hello World</title>
<link rel="stylesheet"  type="text/css" href="site.css">
<style type="text/css">
/* This is my local style, used on this page only */
/* Would be nice to INCLUDE global class in my local class like so */
.localproperties { color: red; classname: globalproperties; }
.otherproperties { color: green; classname: globalproperties; }
</style>
</head>
<body>
<table>
     <tr>
          <td class="localproperties">This is now RED and HELVETICA!</td>
          <td class="otherproperties">This is now GREEN and HELVETICA</td>
     </tr>
</table>
</body>
</html>


Both local styles (localproperties and otherproperties) are used for very
different things, but each one has the global styles in common.
Pete





Mike Grassman <mike@designing-solutions.com> on 07/25/2000 04:16:02 PM

To:   Peter Foti@pctco.com
cc:

Subject:  Re: Giving a class the same values as another class




>Is it possible (or are there any plans to make it possible) to include the
>properties of one class inside the properties of another?

This may be considered cheating but you should be able to use

<link rel="stylesheet" type="text/css" href="global.css" />
<link rel="stylesheet" type="text/css" href="local.css" />

This will cause the global to load first and then give local.css precedence
over global.css.

The contents in global.css
         .para{ font-size : 100%;}

The contents in local.css
         .para { font-size : 120%; }

So the font size of <span class="para">120%</span>

Hope that helps

Mike

Received on Tuesday, 25 July 2000 16:37:21 UTC