Question

In the below example link 2 comes out white and not black as expected how can I style the color of link two without wrapping it in a container tag?

.text a{
color:#FFF;
}


.black{
color:#000;
}

<div class="text">
<a href="#">Link 1</a>
<a href="#" class="black">Link 2</a>
</div>

Answer 1

Your second selector needs to be more specific than the first one to override it:

.text a {
color:#FFF;
}

.text a.black {
color:#000;
}

<div class="text">
<a href="#">Link 1</a>
<a href="#" class="black">Link 2</a>
</div>