Solved

Inheritance in CSS

Posted on 2001-07-06
13
406 Views
Last Modified: 2008-03-10
Hi all ,
Please forgive me about this question since i'm asking just because I don't have the time to look for the answer and I hope someone will know the answer without spending time on it.

So , for the question  , Is there a way to inhert CSS properties from one class to another ?

For example :

FURNITURE  
  {
  made-off:wood;
  }

DOOR
  {
  typeof: "FUNRNITURE";
  shape:like-square-but-not;
  }

and when using this CSS block , DOOR will be "made-off" wood.

Does someone knows of anything similer ??

Please don't get into the "inherit" peropertie since I am familier with it , and it has nothing to do with my questions.

Thanks in advance,

                  Avner.
0
Comment
Question by:avner
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 4
  • 3
13 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6259948
The short answer is no, but everyone knows I hate short answers.

So while it is not possible to use typing for inheritance, you can
use scoping, which probably already understand:

  .furniture {made-of:wood}
  #door {shape:like-square-but-not}
  .funiture #door {trim-type:brass}

anything with an id of "door" has the shape attribute, but if
contained in an element of class furniture it is also made of wood and
has brass trim.

I'm not sure that is what you are looking for, but that is about as
close as you can get to direct casting of the attributes based on the
value of another class.

HTH

Cd&
0
 
LVL 14

Author Comment

by:avner
ID: 6260224
CD,
your suggested answer is what I already know.
I'm hoping to read something that I didn't know , I will leave this question open a little more and if I won't receive any new insights , I'll accept your answer.
thanks for the help.

avner.




0
 
LVL 8

Expert Comment

by:klykken
ID: 6260455
hmm what about:

.furniture, .door  {made-off: wood;}
.door { shape:like-square-but-not; }

It's not inheritance, just another way of structuring your css rules.
--
klykken
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 14

Author Comment

by:avner
ID: 6260474
klykken ,
This is what I call a new insight !

But...
The reason why I've never tried this way of declaring CSS was because it looks weird to declatre one rule twice.

Are you 100% that on all platforms and all browsers , CSS will allow this usage ?
Have you ever notice anything about it in the W3C CSS recommandation ?


avner.

0
 
LVL 8

Accepted Solution

by:
klykken earned 106 total points
ID: 6260553
avner,
You don't have to be afraid to use this structure of css.
This is called grouping and is quite common.
You would maybe declare a font this way for your site:
body, table, td, div, span, p {font-family:  Arial, Helvetica, sans-serif;}

This is part of the CSS standard as seen here:
http://www.w3.org/TR/REC-CSS2/selector.html#grouping

In the web-development company I work for we use this way of declaring CSS every day, so I think you can relax. Works at least on 4 browsers and up.
Thats the browsers we test our sites on anyway.

--
klykken
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6260575
It's a little strange, but it works in IE.  Don't have Netscrap here to try it but there is no reason for it to not work on any browser that supports CSS.  It is just a different way of building the cascade.  Good approach klykken.  I would never have tried it that way.  Maybe I'm too conventional.

Cd&

0
 
LVL 14

Author Comment

by:avner
ID: 6260577
klykken ,
Thank you very much for our help , although this is not inheritance , this way is good enough to solve my problem since the whole inheritance thing came originally from the fact that I wanted to be able to declare a "all-around-font"

and I can achive this using the grouping thing.

0
 
LVL 14

Author Comment

by:avner
ID: 6260583
btw - Cd , thanks for your help, sorry I couldn't help incearsing your points status in this area , I know you need it....:)
0
 
LVL 8

Expert Comment

by:klykken
ID: 6260603
avner, glad to be of quick help, and thanx for the A :)
..and don't wory about COBOL, he has enogh points already ;-)

cobol: I tried some solutions with wildcards (*) until it finally struck me to use grouping this way, funny how CSS let you conceptually find different solutions to things. I would never have thought of the set of rules in your first comment.
--
klykken
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6260627
I think I have gotten to a leve where points are not real important.  Good Qs with interesting ideas is where the fun is.  Thanks for posting this avner it makes a good addition to the PAQ.  This TA is only 1 year old but it has really great solutions in it.

Scoping is something I use all the time, and groupings as well.  I just never thought about declare the same class twice for different attribute sets.  Something else to add to the arsenal. :^)

Cd&
0
 
LVL 14

Author Comment

by:avner
ID: 6260642
I'm happy to see that I am not the only one that learned.

Thanks for your help.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6260655
Hmmm... klykken move up into the top ten with this Q passing several other experts including avner.

Cd&
0
 
LVL 14

Author Comment

by:avner
ID: 6260664
... and is well deserved it....:)
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
Suggested Courses

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question