views:

885

answers:

2

Purely out of curiosity, what browsers does Base64 image embedding work in? What I'm referring to is this.

I realize it's not usually a good solution for most things, as it increases the page size quite a bit - I'm just curious.

Some examples:

HTML:

<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

CSS:

div.image {
  width:100px;
  height:100px;
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...);
}

Want to help test? Try the page here.

+8  A: 

Data URIs are currently supported by the following web browsers:

  • Gecko and its derivatives, such as Mozilla Firefox
  • Opera
  • KDE, through the KIO input/output system. This allows the KDE browser, Konqueror to support data URIs.
  • Safari; although Safari's rendering engine, WebKit, is a derivative of Konqueror's KHTML engine, Mac OS X does not share the KIO slaves architecture so the implementations are not shared.
  • Safari for IphoneOS;
  • Google Chrome
  • Internet Explorer 8; Microsoft has limited support to certain "non-navigable" content, such as in tags and CSS rules, for security reasons, including concerns that JavaScript embedded in a data URI may not be interpretable by script filters such as those used by web-based email clients.[4] Data URIs must be smaller than 32k.
  • TheWorld Browser; is an IE shell browser which has a built-in support for Data URI scheme

http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support

Philippe Gerber
Awesome, thanks!
S Pangborn
+1  A: 

Is it available in IE6?

Doesn't appear to be.
S Pangborn