Status
Not open for further replies.

NightLightW

Active Member
173
2011
23
0
Hello,

I learn CSS on one site (maybe you now which) but i have problem with code. Here is what i need to do

So problem is when i click to "compile" this i see error
Code:
[COLOR=crimson]Oops, try again. 
[COLOR=#F80]Are we missing some brown colour eyes.[/COLOR][/COLOR]
Where is the main problem? I cant find any error in code.
Thanks for help.
I love my daughter. One day I'm "daddy", the next day "dada". However CSS is not quite as forgiving.
CSS selectors separated by a " " (space) are known as descendant selectors. For example
div div p { }
This declaration will only affect the <p> element if its nested within 2 or more levels of the <div> element
Please forgive my understanding of genetics, but I have created a simple family tree with <span> elements which represent that person's eye color.
I have targeted one span with a descendant selector with a high specificity (131, 100 + 10 + 10 + 10 + 1) for you

Create more descendant selector declarations to set the color property of each span so that it matches the colour that is described in the spans content.
and here is mu code
Code:
<style>

#familytree .granddad .sonfather span {color:blue;}
#familytree .granddad .sonfather .son span {color:gray;}
#familytree .granddad .daughterwife span{color:#A52A2A}
#familytree .granddad .daughterwife .son span{color:#A52A2A}
#familytree .granddad .son span {color:green;}
</style>

<div id="familytree">

<div class="granddad">
<div class="sonfather">
<span>My Eye Colour is Blue</span>
<div class="son">
<span>My Eye Colour is Gray</span>
</div>
</div>
<div class="daughterwife">
<span>My Eye Colour is Brown</span>
<div class="son">
<span>My Eye Colour is Brown</span>
</div>
</div>
<div class="son">
<span>My Eye Colour is Green</span>
</div>
</div>
</div>
 
3 comments
are you trying to make them seperate?
Your code is laid out pretty bad if i am honest, you should always put <!- end classname -> at the end of your div so that you know where what ends.

I also don't get what you mean by when you "compile" it?
I just ran it on my browser and i now have this showing up, how it should?


OdrpS.png


so i am not sure what you mean by the this..

Oops, try again. Are we missing some brown colour eyes.
 
I dont know why but this was the true solution for the problem

Code:
<style>

#familytree .granddad .son.father span {color:blue;}
#familytree .granddad .son.father .son span {color:gray;}
#familytree .granddad .daughter.wife span {color:brown;}
#familytree .granddad .daughter.wife .son span {color:brown;}
#familytree .granddad .son span {color:green;;}
</style>

<div id="familytree">

<div class="granddad">
<div class="son father">
<span>My Eye Colour is Blue</span>
<div class="son">
<span>My Eye Colour is Gray</span>
</div>
</div>
<div class="daughter wife">
<span>My Eye Colour is Brown</span>
<div class="son">
<span>My Eye Colour is Brown</span>
</div>
</div>
<div class="son">
<span>My Eye Colour is Green</span>
</div>
</div>
</div>

And now is all everything work perfectly o_o
http://i47.tinypic.com/2ij3epf.png
 
Status
Not open for further replies.
Back
Top