27 users online (1 members and 26 guests)  

Thread: Inheritance


  Results 1 to 14 of 14
  1. #1
    argirardi's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2003
    Location
    Brazil
    Posts
    1

    Inheritance

    Hello dear friends,

    there´s any way to do inheritance between to classes into a css file, like this

    .tableChild{
    boder-botton: 1px solid black;
    font-family: Arial. helvetica, sans-serif;
    }

    .caracterType extends tableChild{
    text-align: right;
    }

    .numericType extends tableChild{
    text-align: left;
    }


    I hope that you have understood me.

    thanks

    Anderson Girardi

  2. #2
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    That's an answer I'd love to know, too, having asked in the past in a different way and getting a non-affirmative response.

  3. #3
    Android's Avatar

    Status
    Offline
    Join Date
    Oct 2002
    Location
    I AM CANADIAN
    Posts
    440

    OK you've set the styles.....

    Now, how would you use the classes in the body of the document to achieve what you want?

  4. #4
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    I think I see what you guys are getting at.

    The code examples in the above post mean you are specifying something that happens naturally in Cascading Style Sheets.

    For example, you links defined at the top -

    Code:
    a {
    font: 12pt verdana, sans-serif;
    color: black;
    }
    Okay, so so far all your links are 12pt verdana, in black. if you set, below this rule, the following rule -

    Code:
    a.bigger {
    font: 15pt verdana, sans-serif;
    }
    All the a tags with class="bigger" would use the larger font size, but they would all still be black because it has inherited the properties of the 'parent' tag, as it were.

    this is how the Cascade works, it will do what you need but your CSS has to flow to get anything near its potential here. this is where, of course, good document structure comes in. Don't give something a class for the sake of it, don't overload your classes, and the cascade works fine.

    unless I misunderstood the problem?
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  5. #5
    Android's Avatar

    Status
    Offline
    Join Date
    Oct 2002
    Location
    I AM CANADIAN
    Posts
    440

    Hi QuietDean.....

    LOL
    I think you nailed it. I couldn't think of the right words...... (but I may still be on the wrong track. It happens!).

  6. #6
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    In other words, the . (period - a presumed C++ convention) is the determinate of the inheritance from the parent before the period or what is called cascading style sheets. Here's what's NOT WORKING for me:

    #mendu { font:10px,verdana;text-align:center }

    #mendu.0 { background:none;text-decoration:none }


    I want mendu.0 to inherit everything in mendu plus the new or revised items defined therein. Have tried it with both ID=mendu.0 and CLASS=mendu.0 and even a.mendu and a.mendu.0 in the .css file - none of them worked.
    Last edited by benzden; 03-19-2003 at 07:59 PM.

  7. #7
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    # refers to an ID (and the spec does require a ID to be unique, btw)

    the period refers to a class. You can have an ID within a class, and that should inherit. However, the rules you set rely heavily on the context of the code.

    It would probably be easier with the full html sample if you have it?
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  8. #8
    Android's Avatar

    Status
    Offline
    Join Date
    Oct 2002
    Location
    I AM CANADIAN
    Posts
    440
    Or use the import/external/embedded/inline method of cascading the styles (what I call IEEI)
    To me, it's much easier to see what's going on.

  9. #9
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    It would probably be easier with the full html sample if you have it?

    #mendu { font:10px,verdana;text-align:center }

    #mendu.0 { background:none;text-decoration:none }


    That's the wrong way to do it. What's the right way?

    (Rather than have me flailing around guessing at what needs to be done, isn't it easier to just provide a very simple example of the .css file coding required for inheritance - that is, the line by line ?classes? needed to pass along the font type to another item that defines its size and thence to a third that defines its color?!)

  10. #10
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    The application of the rules despends heavily on the html structure you are hoping to style.

    \Try using contextual selectors, they flow beautifully. heres some code -

    Code:
    /* Applies to a paragraph contained within an #unique id */
    
    #unique p {
    color: blue;
    }
    
    <!-- Looks like this -->
    <div id="unique"><p> Applies to me!</p></div>
    I realise you have a LOT of code to apply this to, but if your rules aren't working, show me the html as well and I will try to spot whats wrong.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  11. #11
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    The problem is that I'm applying it to words within sentences - not to whole paragraphs or cells. I now use <TT ID=dcomic20r>name</TT> to make a red word comic sans ms of 20px - the TT being a dummy to get it to work.

    I'd like to be able to have <TT CLASS=dcomic.20.r>name</TT> or <B CLASS=verdan.18.g>title</B> or <BIG CLASS=darial.12.hv>heavenly word</BIG> in order to eliminate all the redundancies within the .css file now covering all those combinations of formats.

    I need the class to apply to the dcomic, not to the TT. That may be the limitation of .css.

  12. #12
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    You can always use <span>
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  13. #13
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    In addition to <TT ID=...> you mean? It presumably being another tag that will be ignored by the browser when used in a non-conforming manner but which does activate the associated .css ID or CLASS to apply to the surrounded text?!

  14. #14
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    yes
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?



Tags for this Thread