sneilan sneilan - 10 months ago 58
HTML Question

Override CSS Classes Infinitely

This is more of a theoretical question.

Is the stack of overrides for CSS ad-infinitum? For instance, is there always a CSS override for every override?

Lets say I have written

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
.a {
color: red;
/* Override it again */
div.a {
color: blue;
/* Again! */
body div.a {
color: yellow;
/* Again!! :) */
html body div.a {
color: yellow;
/* AND AGAIN!! */
html body div.a {
color: pink !important;
<div class="a">a</div>

Is !important combined with html body div.a the absolute highest level override for div.a? Must there always exist something with a higher override?


In theory you can simply repeat a rule to increase the specificity. { }

In practise, browsers eventually treat a selector as having too many components and ignore it.

(There is also the style attribute, which is more specific than any selector)