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

font-family cascading inheritence?

P: 3
now for my dumb-question (i note the other forum on 'inheritance' is closed):

my question is about inheriting text properties, and specifically, if font-family values can be cumulatively inherited? That is,
if i have a font-family in a parent div, and I specify 'font-family:"some font" in a child div, will the child also inherit the parent div's font-family if an instance fails to locate the child's specification? - in the sketchout below, that is, will h1 use .text-default's font-family list if it can't find samurai and will h2 try to use .mastname's 'samurai' if it can't find 'courier' and, failing that, go to text-default's list and try those? If the answer is no, is there a straightforward way pass font-family lists as a cumulative property?

If so/not, for which browsers? It seems to be the case for FF 2.0 I'm just starting to test this out, but would appreciate others' experience with this.

thanx -red


Sketchout:

Expand|Select|Wrap|Line Numbers
  1. #content-panel > .text-default h1, h2, h3 
  2.     {font-family: "blah blah",..."blah blah bold"..., sans-serif;
  3.       text-style:blah-blah;
  4.       &etc.}
  5.  
  6. .mastname {font-family: samurai;
  7.                            other properties: blah; }
  8.  
  9. h1.mastname (font-style: something;
  10.                                 font-size:some#;
  11.                                 &etc.; }
  12.  
  13. h2.mastname  {font-family:Courier; }

using divs something like:

Expand|Select|Wrap|Line Numbers
  1. <div id="content-panel  text-defaults">
  2.          <div class="mastname">
  3.                    < h1  class="mastname">SOME TEXT></h1>
  4.                    <h2 class="mastname">OTHER TEXT></h2>  
  5.                    </div>
  6.          </div>
May 28 '08 #1
Share this Question
Share on Google+
3 Replies


P: 3
dear editor,

I'm sorry, but i was not submitting code, or asking for code to analyzed or commented upon. That is why i called it a "sketchout" . Indeed, the selectors wouldn't even work as written (for one thing, they are not independently tagged such as .text-default h1, .text.default h2 {} etc.). That's because my question wasn't about a code problem, but a general question about inheritance and the font-family property. intentionally generalized the sketch. Adding 'taggedly correct' material would only lead readers to think it was real code and comment on that. Not at all what I intended. If/when I do include real code for examination, I will certain follow your suggestions.

Thanx - red.


now for my dumb-question (i note the other forum on 'inheritance' is closed):

my question is about inheriting text properties, and specifically, if font-family values can be cumulatively inherited? That is,
if i have a font-family in a parent div, and I specify 'font-family:"some font" in a child div, will the child also inherit the parent div's font-family if an instance fails to locate the child's specification? - in the sketchout below, that is, will h1 use .text-default's font-family list if it can't find samurai and will h2 try to use .mastname's 'samurai' if it can't find 'courier' and, failing that, go to text-default's list and try those? If the answer is no, is there a straightforward way pass font-family lists as a cumulative property?

If so/not, for which browsers? It seems to be the case for FF 2.0 I'm just starting to test this out, but would appreciate others' experience with this.

thanx -red


Sketchout:

Expand|Select|Wrap|Line Numbers
  1. #content-panel > .text-default h1, h2, h3 
  2.     {font-family: "blah blah",..."blah blah bold"..., sans-serif;
  3.       text-style:blah-blah;
  4.       &etc.}
  5.  
  6. .mastname {font-family: samurai;
  7.                            other properties: blah; }
  8.  
  9. h1.mastname (font-style: something;
  10.                                 font-size:some#;
  11.                                 &etc.; }
  12.  
  13. h2.mastname  {font-family:Courier; }

using divs something like:

Expand|Select|Wrap|Line Numbers
  1. <div id="content-panel  text-defaults">
  2.          <div class="mastname">
  3.                    < h1  class="mastname">SOME TEXT></h1>
  4.                    <h2 class="mastname">OTHER TEXT></h2>  
  5.                    </div>
  6.          </div>
May 29 '08 #2

eWish
Expert 100+
P: 971
Red,

When posting code samples on Bytes.com it is expected of everyone to use the code tags, thus the reason for editing your post. Please review the Posting Guidelines before making additional posts.

Thank You,
Moderator
May 30 '08 #3

eWish
Expert 100+
P: 971
I believe that the child element would inherit from the parent if the font can not be found. That has been my experience with FF 2.0 as well. However, I have not done extensive tests to find if this is always the case. You could set the font in the <body> element to assure that it does inherit. This article may help answer your question.

--Kevin
May 31 '08 #4

Post your reply

Sign in to post your reply or Sign up for a free account.