Sam simply stated:
> I've got a test page at:
> http://www.sam-i-am.com/work/sandbox/components/nested_containers.html
>
> It shows some tests I'm doing with nesting containers. I'm trying to
> define some container styles that will work nested one in the other
> (to a reasonable, arbitrary depth e.g. 4 or 5).
> The markup for each container type will be uniform, I've used a P here
> to indicate the problem - when containers are nested, there's some
> abiguity:
>
> ..panel1 .container-type1 p {
> background-color: cyan;
> }
> ..panel1 .container-type2 p {
> background-color: blue;
> }
>
> when a .container-type1 is nested in a container-type2, both rules
> could apply. My understanding was that proximity would win out, so a P
> in a container-type1, nested in a container-type2 would pick up its
> background-color from its nearest container - container-type1. But not
> so...
> Weirder still, when I increase specificity, seen in the 2nd panel
> like so:
> ..panel2 .container-type2 .container-type1 p {
> background-color: pink; /* this isnt working. */
> }
> ..panel2 .container-type1 .container-type2 p {
> background-color: purple;
> }
Sam,
It looks to me like your second statement is overriding the first.
In the first statement, you've designated panel 2, both types of
containers, to have pink backgrounds.
In the second statement, you've designated panel two, both
containers, to have a purple background.
Also, remember that the p will be recognized by CSS as controlling
your <p> paragraphs. I think that means that the paragaph color is
overriding any desired color callouts.
Instead of marking the problem items with a letter, you should
probably use a /*comment*/
Not sure if that means anything, or if I'm right...I'm no expert,
just a beginner.
Dave Pierce
Pierce Art & Design
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
