Non funziona lo pseudo elemento :before

[istrice95]

Ciao a tutti, vorrei mettere una frase subito prima dell'immagine. Nel documento html c'è semplicemente un'immagine.
In quello CSS invece, ho scritto questo:

IMG:before
{
 content: "Ecco la foto dei soldati in Afghanistan:";
}

Però, né con Chrome, né IE, né Firefox riesco a farlo funzionare...
Qualcuno può aiutarmi? Grazie.

[ResianTaxidrive]

perchè img l'hai scritto maiuscolo? è un errore, va scritto in minuscolo

[istrice95]

Originariamente inviato da ResianTaxidrive
perchè img l'hai scritto maiuscolo? è un errore, va scritto in minuscolo

ok, grazie, l'ho messo in minuscolo, ad ogni modo non funziona lo stesso (idem con :after)...

[ResianTaxidrive]

praticamente non funziona con nessun browser o tipo con Safari e OPera sì?

[ResianTaxidrive]

facendo qualche prova, credo che non funzioni con tutti i tag. Prova a chiudere l'immagine in un a o uno span e applicare la pseudo-classe. Non capisco bene il criterio, sembra che vada con elementi di tipo inline come a o span, ma funziona anche con h1 ma non con i div.

[istrice95]

Originariamente inviato da ResianTaxidrive
facendo qualche prova, credo che non funzioni con tutti i tag. Prova a chiudere l'immagine in un a o uno span e applicare la pseudo-classe. Non capisco bene il criterio, sembra che vada con elementi di tipo inline come a o span, ma funziona anche con h1 ma non con i div.

Ciao, grazie per la risposta.
Ho chiuso l'immagine in un <a>. Lasciando:

img:before 
{
 content: "Ecco la foto dei soldati in Afghanistan:"; 
}

non funziona, mentre se pongo:

a:before 
{
 content: "Ecco la foto dei soldati in Afghanistan:"; 
}

funziona, e la foto va a fianco dell'immagine, in basso a sinistra... Quindi non funziona né con i div né con le img? Questo è molto strano...

[fcaldera]

in teoria :after e :before se non ricordo male non possono essere usati su elementi vuoti (come le immagini che sono elementi autochiudenti)