Css parent selector depending on another class being present

my markup is something like this:

<li class="cont">
    <a> Click Here</a>
    <form>   </form>
</li>

I want to change the background colour of the anchor tag if the form is applied a class for ex: ng-dirty. The form gets applied this class by the angularJs framkework, when that happens I would want to highlight the 'a' tag by changing its background colour.

How can I do this using pure Css(or sass)?

Thanks, Chris.

There no specific CSS selector for this but you can achieve the desire effect with the combination HTML change & box-direction:reverse;. Write like this:

HTML

<div class="cont">
 <form class="ng-dirty">   
     <input type="text" value="Hi"/>
 </form>
 <a> Click Here</a>
</div>

CSS

.cont{
    display:-moz-box;
    display:box;
    display:-webkit-box;
    box-direction: reverse;
    -moz-box-direction:reverse;
    -webkit-box-direction:reverse;  
    -moz-box-orient:vertical;
    -webkit-box-orient:vertical;
    box-orient:vertical;
}
.cont > *{
    display:block;
}
.ng-dirty + a{
    background:yellow;
}

Check this http://jsfiddle.net/8YnTw/ it's with pure css.

You could do this really simply with angular:

<a ng-class="{'dirty-class': myForm.$dirty}"> Click Here</a>
<form name="myForm">
</form>

http://jsfiddle.net/XYTcL/

Use the next css should work:

.ng-dirty a {
    background-color: red;
}