css - Multiple !important class declarations and precedence

Question

Theoretically speaking, if you had this scenario:

<style type="text/css">
    .class1 {
        color:#F00 !important;
    }
    .class2 {
        color:#00F !important;
    }
</style>

<p class="class2 class1">Test</p>

Which color should take precedence? How do browsers determine precedence in this scenario?

Answer 1

According to this source: http://www.boogiejack.com/CSS_4.html

class2 should override the class1 styling.

Order of Specification: As a last resort, when all other conflict resolution specifications cannot determine which style should take precedence, the last style specified will be the style used.