Interlineado y ie

marcvilap · #1 (**permalink**) 27/09/2008, 04:48

Buenas compañeros tengo un problema con un interlineado visto con ie ( con ff se ve genial ).

Quiero mostrar un parrafo con un interlinedo menor al que le correspondería por el tamaño de fuente

#banner p{ line-height:15px; font-size:32px;}

Poniendo esto ff me permite hacerlo pero ie no, se come la diferencia pongo la imagen de los dos

( Firefox)

(Iexplorer)

Grácias por todo

Mikmoro · #2 (**permalink**) 27/09/2008, 09:23

Pues pueden ser varias cosas:
¿has asignado un height a esa caja?
¿has asignado otros valores generales a los elementos "p"?
¿usas un doctype adecuado?

Lo que sí te aseguro es que FF no está haciendo caso a ese interlineado de 15px, o se verían los textos montados (segunda línea sobre la primera).

Pon todo tu código o una url, o será imposible saber qué ocurre.

marcvilap · #3 (**permalink**) 27/09/2008, 10:30

OK

Te pongo primero el HTML

Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<link rel="STYLESHEET" type="text/css" href="estilo_mglfx.css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Gestión</title>

</head>

<body>

<div id="contenedor">

<div id="banner">
<h1> <p> Administración de todo tipo
<p>de patrimonios Inmobiliarios</h1>
</div>
</div>

</body>

y los CSS necesarios

Cita:

body {

font-family: Arial, Helvetica, sans-serif;
background-color:#4D4D4D;
text-align:center;
margin:0 auto;
padding:0px;
}

#contenedor{

width:870px; height:1098px; padding:0px;
margin:0 auto; vertical-align:top; position:relative; top:10px; visibility:visible;
overflow:hidden;
}

#banner { width:550px; height:250px; border:#020202; float:left; clear:both; position:relative;
top:-65px; //top:15px; text-align:left; line-height:50px; padding-top:10px;}

#banner p{ line-height:10px; //line-height:20px;}

h1{ color:#FFFFFF; font-family:Helvetica,Arial,Verdana;font-size:32px; margin-left:24px;

Si quieres puedes ver el ejemplo en :

http://mhou.es/mgl/banner.php

Aparentemente parece correcto pero si bajas hasta abajo de la pantalla y vuelves a subir se ve el error

Gracias por todo

Mikmoro · #4 (**permalink**) 27/09/2008, 11:03

Ah, ya sabía yo que había algo.

Es que lo has hecho en dos párrafos diferentes, y en ese caso el alto de línea te sirve de poco. Más bien debes actuar sobre los márgenes establecidos por defecto de los elementos "p".

Empieza por ponerles

p {margin: 0; padding: 0;}

y vete subiendo el valor del margen según te guste como queda. Eso deberá funcionar exactamente igual en IE que en FF.

Recuerda: margen (superior, derecho, inferior, izquierdo)

margin: 10px 4px 20px 4px (por ejemplo)

marcvilap · #5 (**permalink**) 27/09/2008, 11:33

Mikel gracias primero de todo darte las grácias por tu tiempo.

Haciendo lo que dices tu me queda bien, pero entre las dos lineas me deja un interlineado superior al que deseo. Puse por eso los dos elementos "p". No se si conoces alguna manera de juntar las dos lineas que no sea la que he probado yo de los dos "p"

Gracias por todo

marcvilap · #6 (**permalink**) 27/09/2008, 11:51

Ya lo logré, era problema de padding heredado. Gracias por tu ayuda mikel

Mikmoro · #7 (**permalink**) 27/09/2008, 12:20

De nada, es un placer.