nth-child non funziona

[meliupa]

ho un problema con nth.child non riesco a farlo funzionare bene

#azienda {
width: 1100px;
margin-top: 15px;
margin-right: auto;
margin-bottom: 15px;
margin-left: auto;
}
#azienda ul li {
width: 330px;
float: left;
font-size: 30px;
color: rgba(255,255,255,1);
text-align: center;
line-height: 330px;
margin-left:10px;
margin-right:20px;
height: 330px;
}
#azienda ul li a {
background-color: rgba(244,186,69,1);
border-radius: 50%;
display:block;
text-decoration:none;
-webkit-transition: 1s ease-in-out;
-moz-transition: 1s ease-in-out;
-o-transition: 1s ease-in-out;
transition: 1s ease-in-out;
}
#azienda ul li a:hover {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
background-image:url(../img/team.png);
background-repeat:no-repeat;
background-position:center center;
}
#azienda ul li a:first-child {
background: rgba(79,192,234,1);
}
#azienda ul li a:last-child {
background: rgba(98,188,75,1);
}

questo il css

<div id="azienda">
<ul>
<li><a href="#">Il nostro team </a></li>
<li><a href="#">I nostri lavori</a></li>
<li><a href="#">I nostri servizi</a></li>
</ul>
</div>

l'HTML

non so perchè non lo accetta

 

[marino51]

il problema sta nell'identificare il giusto figlio del giusto padre,
a me sembra che all'interno del tag <li> non c'e un primo ed un ultimo figlio ma solo un singolo elemento
mentre i figli li trovi nel tag <ul>, prova a modificare

#azienda ul li:first-child {
	background: rgba(79,192,234,1);
	}
#azienda ul li:last-child {
	background: rgba(98,188,75,1); 
	}

scusa se, per caso, non ci ho azzeccato ma è la prima volta in vita mia che vedo una costruzione simile
( e l'ho messa nel mio cassetto delle cose buone )
ciao
Marino

 

[meliupa]

ook grazie mille problema risolto!!!