1 - same selector & same properties


.text {
    font-size: 10px;
    color: green;
    padding: 12px;
}
.text {
    font-size: 12px;
    color: red;
    padding: 20px;
}


/* result - remove first selector, keep last */
.text {
    font-size: 12px;
    color: red;
    padding: 20px;
}

2 - same selector, additional property in first one


.text {
    font-size: 10px;
    color: green;
    padding: 12px;
}
.text {
    font-size: 12px;
    color: red;
}


/* result - delete duplicate properties in first
one, keep the single ones */
.text {
    padding: 12px;
}
.text {
    font-size: 12px;
    color: red;
}

3 - same set of selectors, and same properties


.text, .title {
    font-size: 10px;
    color: green;
}
.text, .title {
    font-size: 12px;
    color: red;
}


/* result - remove first selectors */
.text, .title {
    font-size: 12px;
    color: red;
}

4 - two selectors in first one, but same properties


.text, .title {
    font-size: 10px;
    color: green;
}
.text {
    font-size: 12px;
    color: red;
}


/* result - remove first selector name */
.title {
    font-size: 10px;
    color: green;
}
.text {
    font-size: 12px;
    color: red;
}

5 - two selectors in first one, additional property in first one


.text, .title {
    font-size: 10px;
    color: green;
    padding: 12px;
}
.text {
    font-size: 12px;
    color: red;
}


/* result - do nothing */
.text, .title {
    font-size: 10px;
    color: green;
    padding: 12px;
}
.text {
    font-size: 12px;
    color: red;
}

6 - two selectors in last one, same properties


.text {
    font-size: 10px;
    color: green;
}
.text, .title {
    font-size: 12px;
    color: red;
}


/* result - remove first selector */
.text, .title {
    font-size: 12px;
    color: red;
}

7 - two selectors in first one, additional property in first one


.text, .title, .paragraph {
    color: green;
}
.text {
    font-size: 12px;
    text-align: center;
}


/* result - do nothing */
.text, .title, .paragraph {
    color: green;
}
.text {
    font-size: 12px;
    text-align: center;
}

8 - same selectors, same properties, but one with !important


.text {
    font-size: 10px !important;
    color: green;
}
.text {
    font-size: 12px;
    color: red;
}


/* result - remove duplicate properties without 
!important in first one, remove the duplicate 
property overwritten by ! in the second */
.text {
    font-size: 10px !important;
}
.text {
    color: red;
}