I want to know the order of loading the CSS files in a HTML page.
My actual requirement is like this: I have more than 10 CSS files in my application.
I am importing some 3 to 4 CSS files in each HTML page. The problem is I have duplicate classes that defined in some CSS files. That means I override some of the CSS classes in the CSS files.
In some pages it behaves correctly. In some pages it behaves wrongly. I have inline styles defined for some of the DIVs in HTML page also. I am keeping CSS class for that DIVs also.
Can anyone know which one will take higher priority or which one loads first ?
Generally the last rule takes precedence. With that being said, there are “exceptions” in that inline styles take precedence over external stylesheets ( an inline !important is more important than an external !important, etc ), and more specific selectors override generic selectors.
Read all about it @ http://www.w3.org/TR/CSS2/cascade.html