I'm having problems linking a second stylesheet to my HTML document, and cannot find the (hopefully painfully obvious) problem.
I'm linking stylesheets in the head thus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" href="assets/css/global.css" type="text/css" media="all" title="Global styles" charset="utf-8">
<link rel="stylesheet" href="assets/css/ie.css" type="text/css" media="all" title="IE Overrides" charset="utf-8">
The problem is, the seconds stylesheet has no effect what so ever. Reversing their order proves this as well.
For testing, I put in a rule in the second stylesheet to make the body background red, even tried adding !important, but to no avail.
/* Global CSS */
body {
background-color: #fff;
}
/* IE CSS */
body {
background-color: #f00 !important;
}
Firebug net panel shows that both stylesheets do load, and the style panel shows me the styles in both of them, but the rules in the latter just don't do squat.
This has left me baffled, since it is very, very basic stuff, which I've previously done successfully hundreds and hundreds of times.