Is it possible to disabling inheritance within an element?

Discussion in 'CSS' started by coolbananas118, Aug 23, 2009.

  1. #1
    Hi all

    Is it possible to disable inheritance within a div element? I know you can override styles but I want to disable all styles within a div.

    I've got a div element on a page (with lots of content and sub elements in it) and I want to disable all styles for everything contained within the div.

    <div style="disbale all styles">
    <h2>heading</h2>
    ...content content content...etc
    </div>
    ... start applying styles again.

    The only way I can think of doing this is with an iframe however this would require 2 pages, the master page and the iframe pointing to another page. But I don't want to do this because I'm creating the page dynamically on the fly.

    Cheers
    Matthew
     
    coolbananas118, Aug 23, 2009 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    The key isn't to remove all style rules from a context, the key is to not style it in the first place.

    You haven't provided enough info to get a specific suggestion.

    cheers,

    gary
     
    kk5st, Aug 23, 2009 IP
  3. coolbananas118

    coolbananas118 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    @Gary: here's an example;

    How do the email browser clients do it? When you get a nice HTML/CSS email in Yahoo you don't get the CSS from the Yahoo heading tags (H1,H2,etc) clashing with the heading styles/CSS of the email?

    <style>
    h2 {color: #FF0000}
    </style>

    <h2>What a great site</h2>
    <p>I hope you like this great site...</p>

    <div class="cancel_inherited_styles">
    ...dynamic content here...
    <h2>some heading which shouldn't be red and I don't want to override to achieve this</h2>
    ... more dynamic content...
    </div>
     
    coolbananas118, Aug 23, 2009 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #4
    I'd need to know the page's structure, and where that bit fits in.

    gary
     
    kk5st, Aug 23, 2009 IP
  5. coolbananas118

    coolbananas118 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    @Gary: I've tried to keep it quite simple otherwise people will see a load of code and not help. I'd hoped my simple explanation would have made it clear but perhaps it's only clear in my head so let me provide more info;

    I've got a CMS which has an CMS stylesheet etc. I want to have a div panel which is a preview of how the div panel will appear on the front end of the website. The styles of the CMS are clashing with the dynamic content in the div. The content within the div is generated by a author/user via a wysiwyg so they could use all sorts of tags etc which would clash with the CMS styles. It would be painful to give the preview-div a class and override all CMS styles hence why I want syntax to disable/cancel inheritance of the CMS styles on the preview-div. Even if I was to override styles I'd have to remember to override new styles (I can imagine adding a h5 style to the CMS and forgetting to override it in the preview-div styles). Hopefully that spells it out a bit better. I can provide code if that helps.

    P.S. If you're the same Gary from the other forum appologies for triple posting. I've never needed a CSS forum till now (I've figured everything out for myself) hence why I was trialling several forums.
     
    coolbananas118, Aug 24, 2009 IP
  6. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #6
    Not sure I really understand where you're going with this, but I'll try. It's a matter of specificity. Go ahead and give your little region its own ID, and set style rules for that ID's descendents. As for forgetting something, don't forget that CMS stands for content management system. Manage just what the user may and may not do. If you find you need another rule, no problem. Since you're selecting only descendents of your ID, no other elements in the page or on the site are affected.

    Re cross posting: No problem as long as you go and sin no more. :D

    cheers,

    gary
     
    kk5st, Aug 24, 2009 IP