Css: does repeating the same class on an element change any behavior?

Question

Mostly out of curiosity, I would like to know if there are any edge cases that can arise from cases like:

<span class="class1 class2 class3 class2 class4">...</span>

(class2 is listed twice)

or

<span class="class1 class2 class3 class2 class2 class2 class3 class4 class4 class3">...</span>

(a more extreme version of the same)

This is obviously messy css and not ideal, but are there any edge cases this creates?

Answer 1

No, none whatsoever, unless you have the habit of using the class attribute:

[class="class1 class2"] {
    /* ... */
}

instead of:

.class1.class2 {
    /* ... */
}

which is terrible practice, of course.

---

Also, although your question isn't tagged javascript, note that if only the first instance of a class is removed and an unlimited number added, say:

function addClass(element, cls) {
    element.className += ' ' + cls;
}

but

function removeClass(element, cls) {
    return element.className.replace(cls, ' ');
}

this will cause problems in more ways than one.