Why does Google Chrome not show base64 encoded images?

base64, google-chrome, image

Solution

This is a bug in Chrome, see bug #105725. The base64-string has to be padded. The following solution works fine: http://jsfiddle.net/TunfH/ (I have added `==` at the end).

<html>
<head>
<style type="text/css">
.minus
{
    width: 11px;
    height: 11px;
    background-image: url("data:image/gif;base64,R0lGODlhCwALAIABAAAAAP///yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw==");
}
</style>
</head>
<body>
<div class="minus"></div>
</body>
</html>

Problem

Firefox, Internet Explorer, Opera accept following code: ``` <html> <head> <style type="text/css"> .minus { width: 11px; height: 11px; background-image: url("data:image/gif;base64,R0lGODlhCwALAIABAAAAAP///yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw"); } </style> </head> <body> <div class="minus"> </body> </html> ``` Chrome (Version 19.0.1084.56) does not. Why?

Original source