Google Chrome, SSL Certificates and Doctypes
Yesterday I received a message from a friend; he told me that people were having trouble with the SSL certificate on a site that I host for him. I fired up Firefox (on my Windows 7 box), loaded his site, and then checked the certificate details. Firefox was quite happy with the certificate, which didn't expire for another three months or so. I then proceeded to check out the site on Firefox Mac, Safari Mac & Win, IE8 Win and Chrome Mac & Win. All of the browsers reported no problems ... except for Chrome, which indicated that there was a mix of secure and unsecure content on the page.
"Well, that's easy enough to fix," I thought to myself and checked the source of the page, only to discover that all of the images, CSS & JS on the page were being loaded via HTTPS. I verified this with Chrome's Developer Tools as well. At that point I started scratching my head ... and had several friends verify they were seeing the same results. I spent some time with Google trying to find some hints, but found nothing helpful, except that Chrome had a problem with incorrectly reporting that sites had SSL issues ... but that was from late 2009, and it appeared that the bug had been fixed since then.
After some time, I noted the following few lines at the top of the page in question:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">I'd never had to worry about changing the doctype before ... and besides, IE, Firefox and Safari were perfectly happy with that setup. I went ahead and changed the "http" to "https" ... and sure enough, Chrome was happy.
So ... this is my attempt to get something into the Google results. If you've got problems with Chrome saying you have insecure elements on a secure page ... check that doctype!
Addendum: While this does seem to work (the page gets rendered properly, while removing the doctype altogether or switching to the skinny doctype caused the page to not render properly), you can't actually fetch the DTD via the https URL, so perhaps this isn't the best solution if you can, for instance, use the skinny doctype without causing problems.
Addendum the Second: Removing the reference to the DTD and truncating the doctype to <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> also seems to work without affecting rendering.
Final Addendum (Maybe): It also appears that using a protocol-relative URL in the doctype works. I just learned about this nifty trick via this blog post ("The protocol-relative URL") by Paul Irish. (HT: Joe Devon) As it stands now, the doctype on the site in question looks like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">