Using the files below and running "prince --style=bug-specificity.style.css bug-specificity.xhtml", I expect the background of #content to be red due to the CSS selector "#main #content" being more specific than just "#content".
However, the background is blue in the resulting pdf and I think this is a bug - please correct me if I'm wrong.
It works as expected if I add "!important" to the rule, but I prefer to use CSS specificity rather than forcing rules to be important.
I have tested with both Prince 7 and 8 and gotten the same result.
Best regards,
Mikkel
==============================
bug-specificity.xhtml
------------------------------
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>bug-specificity</title>
<link rel="stylesheet" type="text/css" href="bug-specificity.css" />
</head>
<body>
<div id="main">
#main
<div id="content">
#content
</div>
</div>
</body>
</html>
==============================
==============================
bug-specificity.css
------------------------------
#content {
background: blue;
}
==============================
==============================
bug-specificity.style.css
------------------------------
#main #content {
background: red;
}
==============================
However, the background is blue in the resulting pdf and I think this is a bug - please correct me if I'm wrong.
It works as expected if I add "!important" to the rule, but I prefer to use CSS specificity rather than forcing rules to be important.
I have tested with both Prince 7 and 8 and gotten the same result.
Best regards,
Mikkel
==============================
bug-specificity.xhtml
------------------------------
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>bug-specificity</title>
<link rel="stylesheet" type="text/css" href="bug-specificity.css" />
</head>
<body>
<div id="main">
#main
<div id="content">
#content
</div>
</div>
</body>
</html>
==============================
==============================
bug-specificity.css
------------------------------
#content {
background: blue;
}
==============================
==============================
bug-specificity.style.css
------------------------------
#main #content {
background: red;
}
==============================