IE6 and 7 reasons "This page contains both safe and insecure elements"

Question

I have an HTTPS site which in IE6 and 7 displays (by mistake) a dialog box that reads:

This page contains both safe and unsafe elements.

Do you want to display unsafe elements?

This does not happen in any correct browsers, but the site is corporate, and many clients are still in Windows 2000 and IE6.

I am familiar with (and eliminated) the following possible causes of this message:

• One or more resources uploaded to the page have http:// instead of https:// - this is the only legitimate reason for displaying an error and will cause the same message in working browsers. Fiddler can identify loaded resources as unsafe, so it’s easy to fix.

• behavior IE .htc files are loaded to provide DHTML functions - they are often treated as unencrypted, even if they are transmitted via the https:// URL, which made them completely useless even when IE6 was new. It is not recommended to use them first.

• IE treats empty frames as unsafe resources , so <iframe src="" or <iframe src="about:blank" cause this error. This is easy to find and fix in code.

• IE5 is used to send AJAX requests as unsafe when using the ActiveX XMLHTTP component. I do not think this is a problem in IE6 and above.

• URI data is not supported by IE 6 or 7 and will not be displayed, but if it is included in CSS, which also leads to an unsafe warning. We have different CSS for IE that do not use them.

• Links to the Javascript protocol in the source for script tags are reported as unsafe : <script type="text/javascript" src="javascript:void(0)"> Easy to avoid by clearing src (thanks Eric!)

• No external libraries load with the page or dynamically, and no CDN is used. We use some third-party plugins, but they are reliably delivered and do not dynamically load any additional content.

There is a lot about this IE error, but everything that I have found so far indicates one of the above problems that I have already fixed.

Are there other bugs in IE6 and 7 that might be causing this error?

Is there a way to determine which IE resource thinks is unsafe?

Answer 1

I found the source of the problem, but it took some copying.

First, Eric Law came up with a prototype tool (exe) in another answer that helped identify the problem.

Insecure resource:

 data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs= 

The problem is that IE6 does not support data URIs, so we do not use them. So where did it come from?

It turns out that jQuery UI 1.8 is a problem, in particular, a fix for another CSS error :

 .ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block; /* http://bugs.jqueryui.com/ticket/7233 - Resizable: resizable handles fail to work in IE if transparent and content overlaps */ background-image:url(data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=); } 

Others seem to have noticed this issue as well , and it was fixed in the latest jQuery UI CSS (1.9 or higher).

My solution was to replace it with a regular url for an empty gif, the problem is resolved.