Vereis: Estoy trabajando en una página web y he visto que funcionaba perfectamente en Firefox. Pero cuando la probé en Internet Explorer descubrí dos pequeños fallos: La imagen de fondo no empezaba arriba del todo ni a la izquierda del todo y una div se movía de su sitio.
He probado todo tipo de hacks e historias y no he encontrado manera de arreglarlo, así que no me queda más remedio que pediros ayuda.
He subido la página con las imágenes y todo para verlo mejor a Megaupload:
h**p://megaupload.com/?d=CQ3DFA52 <= (No puedo ponerlo completo por el filtro antispam. Me he tomado la libertad de modificarlo por no ser spam. Lo mismo he hecho con los demás enlaces)
El código CSS es:
Código:
El código HTML es:/*decoracion y contenedor*/
.tira_up {
width:100%;
height:117px;
background-image:url(imgs/tira_rojo.gif)
}
.contenedor_todo {
width:966px;
background-color:bb8f8f;
vertical-align:middle;
}
/*borde superior de la tabla*/
.contenedor_up {
width:966px;
height:17px;
background-color:bb8f8f;
border:0px;
}
.borde_superior {
width:330px;
height:17px;
float:left;
background-image:url(imgs/borde_superior.gif);
border:0px;
}
/*fila de menu de idiomas*/
.contenedor_menu {
width:966px;
height:46px;
background-image:url(imgs/tira_medio.gif)
}
.logo1 {
width:276px;
height:46px;
float:left;
}
.menu_izq {
width:55px;
height:46px;
float:left;
background-image:url(imgs/menu_izq.gif);
}
.menu_tira {
width:556px;
height:46px;
float:left;
background-image:url(imgs/menu_tira.gif);
}
.menu_der {
width:79px;
height:46px;
float:left;
background-image:url(imgs/menu_der.gif);
}
/*fila de titulo y flores*/
.fila_titulo {
width:966px;
height:77px;
float:left;
background-image:url(imgs/tira_medio.gif)
}
.logo2 {
width:152px;
height:77px;
float:left;
}
.titulo {
width:556px;
height:47px;
float:left;
padding-top:18px;
background-color:#FFFFFF;
text-align:left;
font-family:"Times New Roman", Times, serif;
font-size:26px;
font-weight:bold;
}
.titulo a:link {
color:#AA1111;
text-decoration:none;
}
.titulo a:visited {
color:#AA1111;
text-decoration:none;
}
.titulo a:hover {
color:#EE0000;
text-decoration:underline;
}
.flores {
width:258px;
height:77px;
float:left;
background-image:url(imgs/flores.gif);
}
/*botones a las secciones*/
.fila_interior {
width:966px;
height:128x;
float:left;
background-image:url(imgs/tira_medio.gif)
}
.margen_izq {
width:22px;
height:128px;
float:left;
}
.boton {
width:220px;
height:128px;
float:left;
}
.fila_separatoria {
width:966px;
height:35px;
float:left;
background-image:
url(imgs/tira_medio.gif);
}
/*pie de página*/
.contenedor_pie {
width:966px;
height:56px;
float:left;
background-image:url(imgs/down.gif);
}
.pie_enlaces {
width:400px;
height:25px;
float:left;
padding-top:14px;
padding-left:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
}
.pie_enlaces a:link {
color:#FFFFFF;
text-decoration:none;
}
.pie_enlaces a:visited {
color:#FFFFFF;
text-decoration:none;
}
.pie_enlaces a:hover {
color:#EE0000;
text-decoration:underline;
}
.pie_centro {
width:55px;
height:56px;
float:left;
}
.pie_direccion {
width:480px;
height:25px;
float:left;
padding-top:14px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#FFFFFF;
}
Código:
Si alguien supiera como resolverlo se lo agradecería infinito.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h**p://w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="h**p://w3.org/1999/xhtml"> <head> <title>Bienvenidos a White Rose</title> <title></title> <link href="estilo.css" rel="stylesheet" type="text/css" /> </head> <body bgcolor="#ff4c4c" marginheight="0" marginwidth="0"> <div class="tira_up"></div> <br /> <center> <div class="contenedor_todo"> <div class="contenedor_up"> <div class="borde_superior"></div> </div> <div class="contenedor_menu"> <div class="logo1"><img src="imgs/logo_1.gif" align="left" /></div> <div class="menu_izq"></div> <div class="menu_tira"><a href=""><img src="imgs/espanol.gif" border="0" align="right" /></a><a href="english/index.htm"><img src="imgs/english.gif" border="0" align="right" /></a> </div> <div class="menu_der"></div> </div> <div class="fila_titulo"> <div class="logo2"><img src="imgs/logo_2.gif" align="left" /></div> <div class="titulo"> <a href="">WHITE ROSE VALLADOLID</a></div> <div class="flores"></div> </div> <div class="fila_interior"> <div class="margen_izq"></div> <div class="boton"><a href="presentacion.htm"><img src="botones/presentacion.png" border="0" align="right" alt="Texto ALT" /></a></div> <div class="boton"><a href="clases.htm"><img src="botones/servicios.png" border="0" align="right" alt="Texto ALT" /></a></div> <div class="boton"><a href="horarios.htm"><img src="botones/horarios.png" border="0" align="right" alt="Texto ALT" /></a></div> <div class="boton"><a href="dondeestamos.htm"><img src="botones/mapa.png" border="0" align="right" alt="Texto ALT" /></a></div> </div> <div class="fila_separatoria"></div> <div class="fila_interior"> <div class="fila_separatoria"></div> <div class="contenedor_pie"> <div class="pie_enlaces"> <a href="pprivacidad.htm">Política de privacidad</A> | <a href="mailto:whiterose_vaatyahoo.es">Contacto</A> | <A HREF="h**p://dremin.com">Diseño: Rael del Fraile</A> </div> <div class="pie_centro"></div> <div class="pie_direccion">López Gómez, Nº 28. 47002 VALLADOLID - ESPAÑA (+34) 983 305 605</div> </div> </div> </center> </body> </html>
Muchas gracias.
