ansaurus

Question

HTML-CSS: Is it really necessary to use "inherit" value for the style properties in HTML design?

Answer 1

+3 A:

Refer to the W3C's specification for 'inherit' value.

Excerpt:

The 'inherit' value can be used to strengthen inherited values, and it can also be used on properties that are not normally inherited.

To me, this is a better phrasing rather than "increase the weight of the inherited property".

As for the IE7 inherit question, check this SO post on IE7 CSS inherit problem

UPDATE:
Using K Prime's sample code, here's the test I did on IE7 vs IE8/FF3.5

Html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html>
<head>
<style type="text/css">
p { color: #666; }
p a { color: blue; text-decoration: underline; }
p a.inactive { color: inherit; text-decoration: none; }
</style>
</head>
<body>
<a href="#">should be default</a>
<p>
<a href="#" class="inactive">should be grey</a>
<a href="#">should be blue</a>
</p>
</body>
</html>

IE7 output:
IE7

IE8/FF3.5 output:

So well, IE7 failed the 'inherit' test for this one.

o.k.w 2009-12-21 05:53:24

So we can't help IE in cases like what "K Prime" (in other answer) has mentioned .. isn't it ?

infant programmer 2009-12-21 05:59:21

I've not tried it myself on IE. "K Prime" is trying to illustrate the intended usage of 'inherit'. My hunch is, it probably won't work on IE, sorry mate.

o.k.w 2009-12-21 06:01:36

its ok .. not really a problem .. I just wanted to be clarified with it (I am confident to try some work-around).. It has always been the problem with browsers .. that they don't follow up W3C recommendations promptly .. anyway .. thanx for the interaction :)

infant programmer 2009-12-21 06:08:44

@infant programmer: I did the test, refer to my updated post. :)

o.k.w 2009-12-21 06:26:53

@o.k.w, thanx for the informative post :) .. felt, Its really a handicap about IE ..

infant programmer 2009-12-21 07:08:55

Answer 2

+2 A:

This is used to override a previously set custom style, or undo a customisation. To clarify:

p { color: #666; }
p a { color: blue; text-decoration: underline; }

p a.inactive { color: inherit; text-decoration: none; }

All links (a) inside a paragraph will be blue, but this will set those with inactive to inherit from parent (the p), which will make them gray in this case.

K Prime 2009-12-21 05:53:28

How about IE, Does this code work in IE too ?

infant programmer 2009-12-21 05:56:37

Sadly, from experience, no - at least not on IE6, and IE7 for certain properties

K Prime 2009-12-21 06:25:34

ansaurus

tags:

views:

answers:

HTML-CSS: Is it really necessary to use "inherit" value for the style properties in HTML design?

related questions