Os utilizadores de Internet Explorer 5 e 6 terão reparado que o “selo” que pus no blog não funcionava como era suposto. Ou melhor, o IE não é capaz de ler correctamente os estilos CSS usados para fazer esse efeito. E, mais uma vez, obriga a um “work-around” que só serve para complicar.
Assim, o selo fica com várias versões possíveis, todas elas com código válido, mas com comportamento diferente de acordo com os browsers usados:
Versão 1:
selo fixo no canto superior direito da janela do browser, funciona em browsers modernos e inteligentes (exclui IE 5 e 6)
copiar e colar a seguir a <body>
<div id="selo" style="position:fixed; left:100%; top:0px;
height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>
Versão 2:
selo fixo no canto superior direito da página (desaparece com o scroll), funciona em todos os browsers modernos e mesmo nos pouco inteligentes (inclui IE 5 e 6)
copiar e colar a seguir a <body>
<div id="selo" style="position:absolute; left:100%; top:0px;
height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>
Versão 3 (a que está em uso neste site):
selo fixo no canto superior da janela do browsers modernos e inteligentes e no canto superior da página nos pouco inteligentes (inclui IE 5 e 6)
copiar e colar a seguir a <body>
<style type=”text/css”>
body>div.selo {position: fixed;}
div.selo{
margin: 0 -100px -100px -100px;
text-align: right;
position: absolute;
top: 0px;
left: 100%;
width: 100px;
right: 100px;
z-index:1000;
}
</style>
<div class="selo">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>
Claro que os experts de CSS me dirão que há outras formas de resolver isto e que até há formas que servem para ter um comportamento uniforme em todas as plataformas, mas como não gosto de arriscar demasiado ficar com CSS inválido e acho que deve haver um mínimo de proporcionalidade entre o tempo que se perde e o ganho que se tem, fico-me por esta solução.
Depois de mais um bocado de volta destas trapalhadas do comportamento do CSS em IE, até dá vontade de sugerir que se usem estes selos colocando apenas a imagem num sítio do site ou blog como o topo da barra lateral ou assim. Essa solução, tão simples, passa apenas por colar no sítio onde se quer a imagem esta linhazita de código:
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
Há quase um ano que este blog ostenta no canto superior direito um “selo” de apoio à Associação Portuguesa de Deficientes. A ideia surgiu dum dos membros da direcção da Associação, que precisava de apoio técnico para o colocar no seu próprio blog, e foi com prazer que ao resolver o problema dele, marquei também o meu próprio site. Entre um canto destes e um banner de suporte a causas mais globais ou afirmações humorísticas de independência (estou a pensar na piaçaba, sim), pareceu-me adequado tomar esta posição. E continua a parecer mas, passado um ano, estava a considerar a hipótese de começar a ter alguma rotação no “selo”, destacando por períodos, associações, causas ou organizações que possam ter interesse num modesto contributo para a sua visibilidade online. Não sei que resultado teve este selo para a APD, mas o selo, além de ficar disponível no meu site, pode ser usado por outros, já que partilho o código (sem erros, desta vez) e crio e alojo a imagem necessária.