Can't stop a div class from inheriting styles from parent div!

OK, this is driving me insane!

In one external css file I have this:

#content h3 {
    color: #444444;
    font-size: 18px;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: normal;
    margin: 25px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    }

Code (markup):

and in another external css (it belongs to a plugin, that's why it's separate) I have:

div.mysubdiv h3 {
margin: 0;
padding: 0;
}

Code (markup):

Now, the div with class 'mysubdiv' is found WITHIN the div with ID 'content' yet no matter what I do, 'mysubdiv' continues to inherit the margins (the 25px top margin is bugging me) from the parent div - and some other attributes too, I have just simplified the problem. Yet some attributes I CAN override. What's with that, anything obvious anyone can see here?!

 

Did you try this?

#content .mysubdiv h3 {
properties...
...
...
}

Code (markup):

 

I know why you are going insane.
#content h3 {
color: #444444;
font-size: 18px;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
margin: 25px 0px 0px 0px;
padding: 10px 0px 10px 0px;
}
doesn't carries information for class="content" rather it carries the CSS information for <div class="content"><h3>This</h3></div>

Change your CSS properties in

#content {
...
}


Not in #content h3 {
...
}

Hope this helps

 

Thanks for the help everyone, the above solution actually put me on the right track. I don't know why I thought the parent div didn't need to be specified in the class definition, but there you go. Actually, I have a parent div within my actual plugin, so I specified THAT div rather than #content - because it's for a plugin I can't know for sure that the user will have a parent div called #content, otherwise the other solution would have been fine too.

Thanks again. Sigh, so much to learn about css still...