IE6 and IE7 don’t play nice with the use of url(data: in css stylesheets. It took me quite a while to narrow down on what was causing the “This page contains both secure and nonsecure items” message in IE7. Both Firefox and Chrome has no issue with a secure page I was developing. It turns out that IE6 and IE7 have a bug .

What lead me to understanding this issue was a post at stackoverflow.com. A user there mentioned that Eric Lawrence, a Microsoft employee who worked on developing IE6 & 7, stated:

Other quirks to be aware of: In IE6, we treat “about:blank” as insecure content, as well as “javascript:” and “res:”. In IE7, we fixed the “about:blank” case, but we have not (yet) changed javascript and res.

This lead me to think well… maybe there is something else they missed. So I hunted down through my code and tested each part by removing bits and pieces until I discoverted it was the url(data: tag for a background in a css stylesheet.

My solution is to provide a separate stylesheet for IE6 & 7 that overwrites the url data tag. More solutions for this can be found here, IE7 and url(data:=…) via https gives mixed content warning.

FYI, here is a great reference on CSS Specific Rules for Internet Explorer – these can help in overwriting the url data tag.

IE7 and url(data:=...) via https gives mixed content warning