starter question on selector order

css selectors

[Venereo]

hi there. i've just started working with CSS, and i've got this dumb question: what's the diference between p.heading and .heading p, for instance.

Thanks in advance,

Hugo Botas

[edited by: SuzyUK at 9:28 pm (utc) on Sep. 15, 2006]
[edit reason] no sigs thanks. per TOS [/edit]

[SuzyUK]

that is so not a "dumb question" that I'm going to go edit the title of this post!

it may seem easy to those that know, but not so long ago it was a FAQ - that was explained patiently - so why not now?

does anyone remember the right to left rule of inheritance?

[edited by: SuzyUK at 10:31 pm (utc) on Sep. 15, 2006]

[cgcody]

Hi, Venereo.

These are called contextual selectors. They basically allow you to specify how a certain class will behave for different tags. For example, you could have, in your CSS: p.highlight{font-weight:bold;} and h1.highlight{text-decoration:underline;}
Any <p class="highlight"> will be bold and any <h1 class="highlight"> will be underline.

In your example, .heading p will be just the opposite. Any <p> tag within another tag that has a class="heading" will be affected. For example:
<div class="heading">
<h1>This will not be affected.</h1>
<p>This will be affected by whatever you define as .heading p.</p>
</div>

EDIT: and I agree, there is no such thing as a stupid question. :)

[Venereo]

understood! tnx for your help. it makes sense now []