Jak zmienić obraz wewnątrz wiadomości sprawdzania poprawności formularza HTML5?

Question

Używam this article, zmieniam styl niektórych z moich wyskakujących okienka sprawdzania poprawności formularza HTML5. Jednak moje komunikaty o błędach nadal mają domyślny, pomarańczowy wykrzyknik w błędzie, oprócz dodanego czerwonego X-a. Jak pozbyć się pomarańczowego wykrzyknika (patrz zdjęcie poniżej). Jak dotąd testuję tylko w Chrome.

Oto CSS, który używam z tego artykułu:

::-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

Spróbuj:

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

lub, oczywiście:

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

Jsfiddle tutaj: http://jsfiddle.net/xhqhV/