Opa... depois de um tempo sem escrever nada... vamos lá!!!
Estava eu ontem na faculdade, mais precisamente no laboratório de informática, desenvolvendo algumas coisas básicas em ASP. Um amigo sentou do lado e começamos a falar de CSS. Ele é bem leigo no assunto e, por isso, fui mostrando umas coisas básicas como formatação de texto, bordas, etc.
Aí eu lembrei do "first-letter" e fui mostrar o que se podia fazer com ele.
Então criei:
p:first-letter{
padding: 10px;
background: #ccc;
font-size: 18pt;
color: #000;
border: 1px solid #333;
}
Fomos visualizar no Firefox e tudo certinho. Mas quando fomos ver no IE... nada aconteceu!
Mas aí eu lembre que já vi no
X-tudo do
Caparica um teste com first-letter e first-line e que funcionava no IE. Acessei o site e funcionou perfeito. Não acreditei, peguei o código dele e comparei com o meu... tudo estava igual, exceto por um detalhe: no código dele, depois do seletor havia um espaço antes de abrir a chave.
Meu código:
p:first-letter{}
O dele:
p:first-letter {}
Coloquei o espaço no meu código e "pumba"... tudo funcionou perfeito.
Como nem ontem e nem hoje ainda tive tempo de ir atrás para ver o porque disso, deixo apergunta aqui: Isso é um bug do IE? Existe algo na especificação do CSS, no caso do first-letter, que dita que é necessário um espaço entre o seletor e a chave?
Achei muito estranho tudo isso, pois somente como first-letter isso me aconteceu... eu não costumo dar esse espaço depois do seletor. sei lá!!!
Quando eu descobrir algo eu posto aqui de novo!