what is the proper styling convention?

[richard]

<div class="one">
<div class="item">data</div>
</div>
<div class="two">
<div class="item">data</div>
</div>

In this example I want to have "item" showing as one color in "one".
Then in "two"showing as another color.
How is this done properly?

 

[Ben Bacarisse]

<div class="one">
<div class="item">data</div>
</div>
<div class="two">
<div class="item">data</div>
</div>

In this example I want to have "item" showing as one color in "one".
Then in "two"showing as another color.
How is this done properly?

The trouble with examples is that it's hard to determine what the
general rule is. To apply a style to all elements with class "item" that
are descendents of an element with class "two", you'd write

.two .item { ... }

(and analogously for class "one"). But all of these selectors work as
well:

.two div
.two > .item
div.two .item
.two div:first-child

and so on and so on. The "best" solution depends on exactly what the
divs represent.