views:

514

answers:

2

The website says it's supported however the following style does not render.


    <style type="text/css">
        a[href="#"]{outline:#f00 dotted 2px !important}
    </style>

however, the following will render


    <style type="text/css">
        a[href="#"]{border:#f00 dotted 2px !important}
    </style>

Here is my document


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title>...</title>
   <link type="text/css" rel="stylesheet" href="../content/style.css" />

</head>
<body>...</body>
</html>
+2  A: 

Maybe because the link does not appear in the browser as # but as yourpage.html#

Try using ends-with instead:

<style type="text/css">
    a[href$="#"]{outline:#f00 dotted 2px !important}
</style>
James
a[href="#"]{border:#f00 dotted 2px !important} works
Dave
@James border works, outline does not work
Dave
Border is not the same as outline. He's just pointing out that the selector that he's using works for his purposes.
David Ma
+3  A: 

Check whether IE8 is rendering in a compliant mode. If you have something like the following in the your header, then outline will not work:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >

IE8 will also default to quirks mode if your doctype tag is incorrect, so verify this as well. Also, if you're using IIS, it's possible that the server is forcing IE7 compatibility mode.

David Ma
I've add the head of my document to my original question. It is xhtml 1.0 strict and it validates
Dave
that was it, i had compatibility mode turned on
Dave