Outro dia estava a navegar pela imensa teia (poético, não) quando me deparei com o post “Isso está na especificação do CSS, é um bug do IE ou é burrice minha mesmo!?! “, do Gustavo Cardoso. Relembrei, então, que quando estava exercitando CSS com o padrão proposto pelo Revolução do CSS, encontrei uma situação que me pareceu bastante estranha. É o seguinte: os links dos menus funcionavam perfeitamente no Firefox, Netscape e IE, mas não funcionavam no Opera – tenho somente estes instalados no meu micro e, portanto, não sei o comportamento em outros browsers.

Encontrei a solução, assim meio que na tentativa e erro e uma boa dose de bom senso, mas não sei até hoje a razão na “ponta do lápis” e gostaria muito de saber. Quem se habilita?

Detalhando o problema:

No exemplo em que os links funcionam no Opera e nos demais browsers acima mencionados acrescentei o float:right e substitui o position: absolute por relative, na classe navegação como indicado abaixo. Veja aqui um exemplo:

/*……. NAVEGAÇÃO……..*/
.navegacao {
position: relative; /* Para o que não funciona -> position: absolute; */
top:205px;
right:25px;
width: 160px;
float:right; /* Para o que não funciona -> este atributo não existe */
}

O exemplo em que os links não funcionam sómente no Ópera (retirada do float e position: absolute) você pode ver aqui . A mesma situação pode ser observada no tema One Ring – muito bom, por sinal -, do Cláudio Dias publicado no Revolução do CSS.