Posicionamento no Internet Explorer 3.0x

Posicionamento no Internet Explorer 3.0x

Em primeiro lugar, note que os métodos de posicionamento para o Netscape e o Internet Explorer descritos nesta página não s&atildeo as únicas maneiras de se criar revestimentos. Entretanto, ao usar os métodos descritos aqui, você poderá montar uma página que vai funcionar em todos os três browsers -- contanto que você use um JavaScript para carregar o style sheet apropriado para cada browser e prepare as camadas (layers) posteriores (estes scripts serão apresentados logo a seguir da explicação sobre posicionamento).

Criar revestimentos para o IE 3.0(x) requer uma estratégia diferente da que foi utilizada para o IE 4.0 e o Netscape 4.0, porque o IE 3.0 não suporta posicionamento da mesma forma. Em vez disso, você vai precisar usar as propriedades de margem de Caixa (margin-top, margin-left, etc.).

A porção do fundo (background) do revestimento pode ser qualquer elemento ou classe:


 	P.hugeding
 	{		
 		font: 80pt 'Wingdings', 'fantasy';
 		color: #FFFF99;
 		}

(Observe que se o elemento que você usa já tem uma cor de background, vai ser preciso utilizar um elemento diferente para a porção anterior (foreground) -- algum que não tenha uma cor de background -- porque se não a cor vai esconder completamente o elemento de fundo.)

À parte da consideração da cor de background, a porção anterior do revestimento pode ser qualquer elemento, mas, uma vez posicionado, você provavelmente vai querer criar uma classe especial para este fim:


 	.shadow3
 	{		
 		font-family: "'Trebuchet MS', 'Arial', 'Sans-Serif'";
 		font-weight: bold;
 		font-size: 30pt;
 		color: #336666;
 		text-align: left;
 		margin-top: -70pt;
 		margin-left: 38pt;
 		}

Observe que o posicionamento aqui está utilizando as propriedades margin-left e margin-top; os valores são melhor determinados por tentativa e erro.

O conteúdo a ser revestido no background deve ser colocado depois do elemento background, usando-se a tag <p> com a classe apropriada:


 	<p class=hugeding>
 	0
 	</p>
 	<p class=shadow3>
 	Arquivos
 	</p>

Observe o atributo class.

Notas Adicionais:

o uso da tag <span> para o elemento foreground produziu resultados inconsistentes para mim; por isso eu recomendei um parágrafo separado depois do elemento background
por causa da falta de verdadeiro posicionamento no IE 3.0, os revestimentos só funcionam quando o texto da porção anterior está todo dentro de uma linha; para assegurar este resultado, você precisa usar seqüências muito curtas de texto ou colocar o revestimento todo dentro de uma tabela que tenha uma largura suficiente para isso (uma prática que eu não recomendo, porque resulta na necessidade de uma barra de rolagem horizontal para os usuários com baixas resoluções de vídeo)