¿Cómo cambio la imagen dentro de un mensaje de validación de formulario HTML5?

Question

Utilizando this article, estoy cambiando el estilo de algunas de mis ventanas emergentes de validación de formularios HTML5. Sin embargo, mis ventanas emergentes de error todavía tienen el signo de exclamación naranja predeterminado en el error, además de la nueva X roja que he agregado. ¿Cómo me deshago del signo de exclamación naranja (ver imagen a continuación). Hasta ahora, solo estoy probando en Chrome.

Aquí es el CSS que estoy usando de ese artículo:

::-webkit-validation-bubble-message 
{ 
    color: #eee; 
    background: #000; 
    border-color: #444; 
    -webkit-box-shadow: 4px 4px 4px rgba(100,100,100,0.5); 
} 

::-webkit-validation-bubble-message:before { 
    content: ""; 
    display: inline-block; 
    width: 16px; 
    height: 16px; 
    margin-right: 4px; 
    background: url(/myPath/myImage.png) 
} 

::-webkit-validation-bubble-arrow { 
    background: #000; 
    border-color: #444; 
    -webkit-box-shadow: 0 0 0 0; 
} 

Answer 1

Probar:

input::-webkit-validation-bubble-icon { 
display: none; 
} 

o, por supuesto:

input::-webkit-validation-bubble-icon { 
background: url(http://google.com/favicon.ico); 
} 

Jsfiddle aquí: http://jsfiddle.net/xhqhV/