CSS Inheritance

Hey Guys,

Just a little confused here.

I have an img class=”wp-smiley” that is defined in the CSS by:

.wp-smiley {
border:medium none;
padding:0 5px 0 0;
}

However, it is not being used because the style:
#content p img {
border:medium none;
padding:0 5px 15px 0;
}

Is overriding it. I am a bit new to CSS. Why would that be overriding? I realize I could just make a CSS statement like:

#content p img.wp-smiley {
border:medium none;
padding:0 5px 5px 0;
}

But I am just trying to figure this out for knowledge sake. Using Firebug I see that it is referencing the style, but it is crossed out because that other style is overriding it?

I thought that if you define a single class like that, it’ll override anything previous?