Hola compañeros, no se exactamente donde tengo que preguntar esto, pero necesito ayuda, estoy creando una web con capas y estilos, y el firefox y en el opera se ve genial, peeeeero en Ie 6 todas las imágenes no se pueden ver, la de los fondos de la cabecera, la del menú etc...
Alguien podría hecharme una mano?? alguien me podría decir que es lo que estoy haciendo mal para que el explorer no me muestre las imagenes de fondo??? os adjunto el código.
página:
Código HTML:
<!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" xml:lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<link href="css/generales.css" rel="stylesheet" type="text/css" />
<link href="css/menu_desplegable.css" rel="stylesheet" type="text/css" />
<link href="css/titulares.css" rel="stylesheet" type="text/css" />
<link href="css/bordes_esquinas.css" rel="stylesheet" type="text/css" />
<link href="css/cabecera.css" rel="stylesheet" type="text/css" />
<SCRIPT type="text/javascript">var tWorkPath="tree-menu/";</script>
<script type="text/javascript" language="JavaScript1.2" src="tree-menu/dtree.js"></script>
</head>
<body>
<!-- Comienza la web -->
<div id="general">
<!-- Dividimos la web en 3 columnas -->
<div id="col_izq"></div>
<div id="col_central">
<!-- Cabecera -->
<div id="cabecera">
<!-- División de la cabecera -->
<div id="cab_sup">
<!-- Inicio pestañas menú -->
<div id="menu_inicio_selected">
<!-- pestañas menú enlaces-->
<div id="pestana_inicio"><a href="#" target="_self">Inicio</a></div>
<div id="pestana_documentacion"><a href="#" target="_self">Documentación</a></div>
<div id="pestana_quienes_somos"><a href="#" target="_self">Quienes Somos</a></div>
<div id="pestana_contacte"><a href="#" target="_self">Contacte</a></div>
<div id="pestana_mapaweb"><a href="#" target="_self">Mapa Web</a></div>
<!-- Fin pestañas menú enlaces-->
</div>
<!-- Fin pestañas menú -->
</div>
<div id="cab_inf">
<!-- Inicio barra menú inferior -->
<div id="barra_inicio_selected">
<div id="buscador_cabecera">Buscar <input name="busqueda" type="text" size="30" height="15px" align="absmiddle"/> <img src="imagenes/formularios/lupa_busqueda.jpg" alt="Realizar Búsqueda" width="37" height="33" align="absmiddle" /> </div>
</div>
<!-- Fin barra menú inferior -->
</div>
<!-- Fin división cabecera -->
</div>
<!-- Fin cabecera Inicio Contenedor -->
<div id="contenedor">
<div id="menu_desplegable">
<!-- Inicio menu tree -->
......(nada).....
<!-- Fin menu tree -->
</div>
<div id="barra_separadora"></div>
<div id="contenido">
<!-- Comienza el contenido de los formularios y resto documentación -->
<div id="contenido_formulario">
<div id="titulo_incidencias"> </div>
<div id="top" class="top">
<img src="imagenes/formularios/esq_sup_izq_form.jpg" alt="Esquina superior izquierda" width="26" height="22" class="esquina_sup_izq" />
<img src="imagenes/formularios/esq_sup_derch_form.jpg" alt="Esquina superior derecha" width="33" height="22" class="esquina_sup_der" /></div>
<div id="content" class="content">
<div id="box_control" class="boxcontrol">
...
</div>
</div>
<div id="bottom" class="bottom">
<img src="imagenes/formularios/esq_inf_izq_form.jpg" alt="Esquina inferior izquierda" width="26" height="33" class="esquina_inf_izq" />
<img src="imagenes/formularios/esq_inf_derch_form.jpg" alt="Esquina inferior iderecha" width="33" height="33" class="esquina_inf_der" /></div>
</div>
<!-- Fin de contenido de los formularios y resto documentación -->
</div>
</div>
<!-- Fin Contendor. -->
</div>
<div id="col_derc"></div>
<!-- Cierre de la division de las 3 columnas -->
</div>
<!-- fin de la web -->
</body>
</html>
Estilos:
Código HTML:
#cab_sup {
float: none;
height: 30px;
width: 840px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
margin-top: auto;
padding-top: 49px;
}
#menu_inicio_selected {
background-image: url(../imagenes/cabecera/inicio_selected.jpg);
background-repeat: no-repeat;
background-position: right bottom;
float: right;
height: 30px;
width: 653px;
text-align: right;
clip: rect(auto,auto,auto,auto);
}
#pestana_inicio {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #00026E;
text-align: center;
float: left;
height: 15px;
width: 116px;
margin-top: 15px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#pestana_documentacion {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #00086E;
text-align: center;
float: left;
height: 15px;
width: 150px;
margin-top: 15px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#pestana_quienes_somos {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #00086E;
text-align: center;
float: left;
height: 15px;
width: 151px;
margin-top: 15px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#pestana_contacte {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #00086E;
text-align: center;
float: left;
height: 15px;
width: 115px;
margin-top: 15px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#pestana_mapaweb {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #00086E;
text-align: center;
float: left;
height: 15px;
width: 115px;
margin-top: 15px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#barra_inicio_selected {
background-image: url(../imagenes/cabecera/barra_inicio_selected.jpg);
background-repeat: no-repeat;
background-position: right bottom;
float: right;
height: 41px;
width: 653px;
text-align: right;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #000066;
}
#buscador_cabecera {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #000066;
float: right;
height: 15px;
width: 300px;
margin-top: 7px;
}
#cab_inf {
margin: auto;
float: none;
height: 41px;
width: 840px;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
a:link {
color: #00086E;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #00086E;
}
a:hover {
text-decoration: none;
color: #999900;
}
a:active {
text-decoration: none;
color: #999900;
}
#general {
float: none;
height: 100%;
width: 100%;
margin-top: 0px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
text-align: center;
}
#general #col_central {
float: left;
height: 150px;
width: 94%;
background-image: url(../imagenes/cabecera/fondo_derc.jpg);
background-repeat: repeat-x;
background-position: left top;
background-color: #FFFFFF;
}
#general #col_izq {
float: left;
height: 150px;
width: 3%;
background-image: url(../imagenes/cabecera/fondo_izq.jpg);
background-repeat: repeat-x;
background-position: top;
}
#general #col_derc {
float: left;
height: 150px;
width: 3%;
background-image: url(../imagenes/cabecera/fondo_derc.jpg);
background-repeat: repeat-x;
background-position: top;
}
#general #col_central #cabecera {
margin: auto;
float: none;
height: 122px;
width: 100%;
vertical-align: bottom;
background-image: url(../imagenes/cabecera/fondo_cabec_logo.jpg);
background-repeat: no-repeat;
background-position: left top;
}
#general #col_central #contenedor {
margin: auto;
float: none;
height: auto;
width: 100%;
}
input {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #333333;
background-image: url(../imagenes/formularios/sombra_input.jpg);
background-position: left top;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-top-color: #CCCCCC;
border-right-color: #CCCCCC;
border-bottom-color: #CCCCCC;
border-left-color: #CCCCCC;
}
#contenido_formulario {
margin: auto;
float: left;
height: auto;
width: auto;
}
#formulario_inferior {
background-image: url(../imagenes/formularios/fondo_inf_rep_form.jpg);
background-repeat: repeat-x;
background-position: center top;
float: left;
height: 33px;
width: 100%;
}
#menu_desplegable {
margin: auto;
float: left;
height: 400px;
width: 22%;
}
#barra_separadora {
background-image: url(../imagenes/fondos_generales/barra_separadora.jpg);
background-repeat: repeat-y;
background-position: center center;
margin: auto;
float: left;
height: 400px;
width: 5%;
}
#contenido {
float: left;
height: 400px;
width: 73%;
margin: auto;
}
Muchas gracias de antemano a todos!!