Interlineado chungo en IE

[Bram]

Tengo un problema con el interlineado en IE. En FF i Safari el interlineado se ve correcto, en IE aparece "doble" o simplemente más grande.

Tengo este código HTML:

Código:

<a href="/PHP/anunci/verAnuncio.php?id=173">
	<div class="anunci">

	       <div class="contenidor_fR">
	             <h2 class="red">Trabajo a distancia</h2><br />
                     <h1 class="red"></h1>
                     <h2>sin votos</h2>
	        </div>
					
<div class="foto_anunci"> <img src="/BD/imatgesBD/usuaris/caraProfe.png" height="80" width="80" alt="foto" /> </div>

	<h1>Oferta traductor jap dist ivan4 vol noti</h1>
	<h2>Quiero trabajar de:</h2>
	<h2> Traductores:Japonés</h2>
	<p>Oleiros (A Coruña)</p>              

</div>
</a>

que corresponde a lo siguiente:

así se ve en FF:



y así en IE7:



podeis verlo en:
http://www.trabajillos.es

os adjunto las CSS implicadas: (anunci significa "anuncio")

.anunci{
border-bottom:1px dotted #0567CD;
padding:5px;
text-decoration:none;
}

.anunci:hover{
background-color:#FED577;
}

.anunci h1{
font-size:14px;
font-weight:bold;
}


.anunci h2{
font-size:12px;
}

.anunci p{
font-size:12px;
}

.contenidor_fR{
float:right;
text-align:left;
}

.foto_anunci{
width:81px;
height:81px;
float:left;
border:1px solid #0567CD;
margin: 5px;
margin-right:10px;
}

.foto_anunci img{
text-decoration:none;
border:0;
}


además, a veces, aún haver puesto text-decoration:none, aparecen subrayado todo el contenido del "anuncio", como de link visitado.

Alguna idea/sugerencia?

gracias de antemano

[emiliodeg]

utiliza internlineados y tamaños de fuente en medida em asi se vera igual en todos los navegadores

[Bram]

nada he puesto las font size de:

.anunci h1{
font-size:14px;
font-weight:bold;
}


.anunci h2{
font-size:12px;
}

.anunci p{
font-size:12px;
}


en em en lugar de px y lo mismo...

[DragonX]

deberías manejar margenes negativos e los H1 / H2 así sube el contenido.

Estos elementos en bloque tiwene "un interlineado" por default.

.anunci h1{
font-size:14px;
font-weight:bold;
margin-bottom:-5px;
}


.anunci h2{
font-size:12px;
margin-bottom:-5px;
}

.anunci p{
font-size:12px;
}

probá con algo así!

[Mikmoro]

Deberías empezar por anular los márgenes a (casi) todos los elementos poniendo en el principio de tu css:

* {margin: 0; padding: 0;}

Luego ya añadirás los márgenes que te interese a cada cosa.

[Bram]

esto del * {margin: 0; padding: 0;} lo he leido en varios lugares pero no termino de entenderlo.

Si hago esto anulo todos los margenes i padding. La idea es que luego ponga el margin i el padding manualmente de todos los h*,parrafos, table,... ?

[Bram]

esto del * {margin: 0; padding: 0;} lo he leido en varios lugares pero no termino de entenderlo.

Si hago esto anulo todos los margenes i padding. La idea es que luego ponga el margin i el padding manualmente de todos los h*,parrafos, table,... para anular los valores "por defecto" que usan cada navegador?

[Mikmoro]

Eso es exactamente lo que te decía en mi mensaje. Con eso evitas problemas de márgenes predeterminados, y así luego asignas los que te interesa.

[Bram]

funcionó!, 1000 gracias