REVISION
Upon review, several errors have been identified:
The color attribute should only contain a valid color name, 6 or 3-digit hexadecimal code, RGB/RGBa, or HSL/HSLa value. The usage of {color:links nav} seems unconventional and unclear. Is this syntax functional?
It has been pointed out by @torazaburo and @Ralph.M that your div classes are considered both first-child and first-of-type elements within an a tag, which means your .update class is not the immediate parent of any divs. To address this, you must add more specificity by traversing through each level in the hierarchy.
div.update.navadiv
Proposed solution:
.update a:first-child div:first-of-type
Note: In this scenario, using either first-child or first-of-type achieves the same result. However, when combined with nth-child, the counting mechanism differs between n-th and nth-type-of.
The :first-of-type selector in CSS targets the initial instance of an element within its container.
.update div {
width: 100%;
height: 25%;
border-top: 2px dashed red; /* color defined */
padding: 5px;
background-color: rgb(0,0,0); /* RGB format */
cursor: pointer;
color: rgba(250,250,250,.7); /* RGBa format */
}
.update a:first-of-type div:first-of-type {
border: none;
}
.update div:hover {
color: hsl(240, 60%, 50%); /* HSL format */
}
.update div:hover > .symbol {
color: hsla(324, 100%, 50%, .8); /* HSLa format */
}
<div class="nav update">
<a>
<div>
<div class="symbol">×</div>update 1
</div>
</a>
<a>
<div>
<div class="symbol">×</div>update 2
</div>
</a>
<a>
<div>
<div class="symbol">×</div>update 3
</div>
</a>
<a>
<div>
<div class="symbol">×</div>update 4
</div>
</a>
</div>
Refer to the GUIDE for more information.