CODEWITHSUNDEEP
cssinternet-explorer-8
David
David

Reputation: 19677

How does Internet Explorer 8 support the CSS outline attribute?

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>

Upvotes: 3

Views: 8826

Answers (2)

David Ma
David Ma

Reputation: 1353

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.

Upvotes: 8

James Goodwin
James Goodwin

Reputation: 7406

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>

Upvotes: 2

Related Questions