3 replies to this topic

[AspMan]

Bom pessoal, olá, a dúvida é a seguinte,

tenho um sistema de imagens em php que ele redimensiona a imagem q busca o caminho no banco, no script eu coloquei uma classe que tem um PADDING de 5px com BORDA de 1px, a dúvida é a seguinte, no Firefox exibe bacana, a bordinha ao redor da imagem com padding, já no IEca não funciona, a borda fica "colada" na imagem sem o padding, alguém pode ajudar??

['' sem.Ponto]

Em qual elemento você colocou as propriedades? Eu colocaria no IMG...

img {
	padding: 5px;
	border: solid 1px #666;
}

[AspMan]

Em qual elemento você colocou as propriedades? Eu colocaria no IMG...

img {
	padding: 5px;
	border: solid 1px #666;
}

entendi a lógica, porém imagina que o site possui mais imagens além das do album, se eu colocar nessa propriedade, todas as imagens terão esse padding...
Estou certo?

o caso é mais específico para algumas img's miniaturas....

Eu estava fazendo uns testes aqui e descobri um bug do IE que resolvi assim *{padding:0;}
mas não foi suficiente...

['' sem.Ponto]

entendi a lógica, porém imagina que o site possui mais imagens além das do album, se eu colocar nessa propriedade, todas as imagens terão esse padding...
Estou certo?

Isso aí é fácil de resolver.

Imagine que a imagem esteja dentro da div #show:

<div id="show">
	<img src="imagem.jpg" />
</div>

Para aplicar o estilo somente nessa imagem, basta fazer o CSS assim:

#show img {
	padding: 5px;
	border: solid 1px #666;
}

Eu estava fazendo uns testes aqui e descobri um bug do IE que resolvi assim *{padding:0;}
mas não foi suficiente...

Todos os navegadores tem valores default para margin e padding de determinados elementos. Então, a primeira coisa que devemos fazer na hora de iniciar um trabalho é zerar os valores margin e padding.

* {
	margin: 0;
	padding: 0;
}