Foros del Web - Ver Mensaje Individual - Problemas de visualizacion entre Firefox e Internet Explorer

luciio · #1 (**permalink**) 15/09/2009, 15:18

Hola buenas tardes, les vengo a molestar compas poruqe fijense que estoy diseñando este sitio: http://www.clinicamagic.com/lucioxhtml/

y tengo un problema por el momento con el pie de pagina que en firefox se ve super bien, pero en internet explorer se encima un poco sobre la capa antecesora y no se como solucionarlo, espero me puedan ayudar porfavor ya que hoy se me presenta este problema y estoy seguro que despues se volvera a repetir entonces quisiera saber como solucionarlo, muchas gracias !

les dejo el codigo:

PD. soy muy nuevo en esto de el disñeo web, jeje.

CSS:

Cita:

* {margin:0;padding:0; border:0; outline:none; position: relative;}

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #8A8A8A;
text-decoration: none
}

P {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #8A8A8A;
}

#contenedor {
width: 776px;
margin-left: -388px;
left: 50%;
top: 0px
}

#topmenu {
width: 776px;
height: 54px;
background-color: #dd7580
}

#menulinks {
width: 700px;
height: 54px;
margin-left: -350px;
left: 50%
}

·div55 {
width: 55px;
}

#leftlogo {
float: left;
width: 208px;
height: 258px;
background-image: url(imagenes/logo.jpg)
}

#header {
float: right;
width: 567px;
height: 258px;
background-image: url(imagenes/cabecera.jpg)
}

#bodyleft {
width: 190px;
height: 370px;
float: left
}

#bodyright {
width: 586px;
float: right

}

#contenedorbd {
width: 776px;
height: 380px;
}

#menuleft {
width: 174px;
height: 342px;
margin-left: -87px;
top: 15px;
left: 50%
}

#contentright {
top: 15px;
width: 540px;
margin-left: -270px;
left: 50%
}

#linea {
width: 776px;
height: 8px;
background-color: #dd7580
}

.corte {
clear: both;

}

.cuadro {
width: 100%
}

.atencion {
width: 260px;
float: left;
}

.sep {
width: 280px;
float: right;
}

.imagenei {
top: 12px;
padding: 0px;
margin-right: 10px;
margin-bottom: 10px;
border: 5px #FFFFFF solid;
float: left;
}

.imagened {
top: 22px;
left: 10px;
padding: 10px;
margin-right: 10px;
margin-bottom: 10px;
border: 5px #FFFFFF solid;
float: left;
}

#contprod {
top: 40px;
width: 540px;
height: 149px
}

#pie {
width: 100%;
height: 90px;
background-color: #dd7580;
position: absolute
}

.img1 {
top: 12px;
padding: 0px;
margin-right: 10px;
margin-bottom: 10px;
border: 5px #FFFFFF solid;
float: left;
}

.logopie {
top: 30px;
right: 20px;
float: right
}

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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<link rel="stylesheet" href="styles.css" type="text/css">
</head>

<body>
<div id="contenedor">
<div id="topmenu">
<div id="menulinks">
<a href="#"><img src="imagenes/btn_1.jpg" width="131" height="54" alt="inicio" /></a>
<a href="#"><img src="imagenes/btn_2.jpg" width="132" height="54" alt="Curso basico delineado permanente" /></a>
<a href="#"><img src="imagenes/btn_3.jpg" width="135" height="54" alt="Curso avanzado delineado permanente" /></a>
<a href="#"><img src="imagenes/btn_4.jpg" width="128" height="54" alt="Productos delineado permanente" /></a>
<a href="#"><img src="imagenes/btn_5.jpg" width="140" height="54" alt="Contacto" /></a>
</div>
</div>
<div id="leftlogo"></div>
<div id="header"></div>
<div class="corte"></div>
<div id="linea"></div>
<div id="contenedorbd">
<div id="bodyleft">
<div id="menuleft">
<a href="#"><img src="imagenes/menu/curso-basico-delineado-permanente.jpg" width="173" height="32" /></a>
<a href="#"><img src="imagenes/menu/curso-avanzado-delineado-permanente.jpg" width="173" height="32" /></a>
<a href="#"><img src="imagenes/menu/curso-paramedico-reconstructivo.jpg" width="173" height="30" /></a>
<a href="#"><img src="imagenes/menu/curso-de-extensiones-de-pestañas.jpg" width="173" height="30" /></a>
<a href="#"><img src="imagenes/menu/curso-de-tatuaje-de-uñas.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/curso-de-rizado-de-pestañas.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/curso-de-tinte-de-pestañas.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/beneficios-alumnas-egresadas.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/certificacion-sep.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/nuestro-objetivo.jpg"q width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/cryoterapia.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/productos-delineado-permanente.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/servicios.jpg" width="173" height="22" /></a>
<a href="#"><img src="imagenes/menu/contactanos.jpg" width="173" height="20" /></a> </div>
</div>
<div id="bodyright">
<div id="contentright">
<div class="cuadro"><img src="imagenes/curso-basico-delineado-permanente-title.jpg" width="377" height="40" /> </div>
<div class="atencion">
<img src="imagenes/contacto-imagen.jpg" width="68" height="79" class="imagenei" />
<br />
<br />
<p>Atención continua y permanente ya sea por vía Internet, telefónica, o acudir a nuestro plantel educativo.</p>
</div>
<div class="sep">
<img src="imagenes/certificacion-sep.jpg" width="75" height="50" class="imagened" />
<br />
<br />
<p>Certificación y constancia como tecnico en micropigmentacion por parte de la asociación mexicana de micropigmentacion y de la s.e.p</p>
</div>
<div id="contprod">
<div class="cuadro"><img src="imagenes/productos-titulo.jpg" width="184" height="37" /></div>
<div class="cuadro"><img src="imagenes/productos-delineado-permanente.jpg" width="540" height="112" /></div>
</div>
</div>
</div>
</div>
</div>
<div id="pie">
<div class="logopie"><img src="imagenes/logopie.jpg" width="109" height="43" /></div>
</div>
</body>
</html>