Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Como faço para deixar essas duas imagens lado a lado e coladinhas, sem nehuma margem entre elas? Estou usando display:inline para deixalas lado a lado mas elas ficam com uma margem entre elas mesmo usando o atributo margin:0px. Alguém sabe como resolver?
http://br.geocities.com/mangakah/test/test.htm
(veja o código fonte)
Grato.
Coloque no início da sua folha de estilos o seguinte:
*{margin:0;padding:0;}
Acho que deve funcionar.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Obrigado pelas respostas.
Giovani, isso realmente tira a margem de todos os elementos menos entre as imagens, então creio que o problema não é esse.
Eu testei no FF3 beta e IE7 para PC/Windows.
Mais alguma ideia?
O que realmente você quer fazer:??
tente assim:
<style>
#tab1 img{
float:left;
}
</style>
<div class="tab" id="tab1">
<img class="tabimg" src="test_r1_c1.gif">
<img class="tabimg" src="test_r1_c2.gif">
</div>Opa silver!
Eu quero retirar esse espaçamento que está aparecendo nas duas imagens com o display:inline, eu dei uma olhada no firebug e ví que estava aparecendo um offset de 18 na segunda imagem. Então consegui resolver o problema após algumas experimentações.
Você acertou no float:left. Valeu!
Problema resolvido.
Opa que bom, lembre-se display:inline; não é para por um elemento do lado do outro e sim para deixar o elementos com "valor" de linha como por exemplo texto.
O inline seria o inverso do block. O block deve ser para layouts e o inline para textos.
Mas cuidado para não perder a semantica.
No Firefox 3 (Mac) que eu estou usando não vejo nenhum espaço.
Mas ja tive esse problema, e resolvi apenas retirando os espaços em branco do código fonte.
<img....>
<img....>
para
<img....><img....>