desaparece la cabecera en iexplorer

suitangi · 12 Nov 2008, 02:31 · Solicitar retirada

Hola,

tengo la siguiente estructura de pagina:

un div cabecera con el título y poco más
un div con un menú Spry horizontal
un div con el contenido restante

Funciona perfecto en Firefox, Opera i Chrome, pero Internet explorer me hace desaparecer la cabecera al cargar la pagina (sospecho que tiene que ver con el menu spry... es como si recargara el fondo (blanco) sobre la cabecera)

Alquien sabe que puede estar pasando y como resolverlo?

Saludos y gracias.

suitangi · 12 Nov 2008, 02:44 · Solicitar retirada

...ademas, en el momento que deplego cualquier submenu, la cabecera aparece.

¿que opinais?

pitufo · 12 Nov 2008, 21:18 · Solicitar retirada

Pon los códigos HTML y CSS ;)

suitangi · 13 Nov 2008, 10:14 · Solicitar retirada

Hola,

El 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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Aura Ioga - contacte</title>

<link href="../auraioga1.css" rel="stylesheet" type="text/css" />

<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>

<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>

<script type="text/javascript">

</script>

</head>

<body>
<div id="container">
<div id="cabecera">AURA IOGA</div>
<div id="menu">
<ul id="MenuBar1" class="MenuBarHorizontal">

nosaltres
<ul>

que fem
qui som
on som
horaris

activitats
<ul>

Ioga
Ioga per a nens
Katsugen Yuki
Ioga mantra
Chi Kung

formació
<ul>

docència

temari

titulació

teràpies
<ul>

PNL
suport psicològic

seminaris
espais
material
contacte

</div>

<div id="todo">

<form action="../cgi-bin/FormMail.pl" method="post" enctype="application/x-www-form-urlencoded" name="contacte" id="contacte">

<div id="formato2c1">
<p class="titular">Contacte:</p>
<p class="titular"></p>
<label for="nom" class="subtitular"><span class="subtitular">
Nom*</span>:</label>
<input name="nom" type="text" class="formnom" id="nom" size="25" />

<label for="cognoms" class="subtitular">Cognoms*:</label>
<input name="cognoms" type="text" class="formcnom" id="cognoms" size="25" />
</p>

<label for="email"><span class="subtitular">email*:</span></label>
<input name="email" type="text" class="formemail" id="email" size="31" />
</p>

<label for="tlf"><span class="subtitular">Telèfon*:</span></label>
<input name="tlf" type="text" class="formtlf" id="tlf" size="12" maxlength="9" />
</p>

<label for="adr" class="subtitular">Adreça:</label>
<input name="adr" type="text" class="formadr" id="adr" value="" size="32" />
</p>

<label for="obs" class="subtitular">Obs:</label>
<textarea name="obs" cols="43" class="formobs" id="obs"></textarea>
</p>
<div>
<div align="center">

<input type="submit" name="env" id="env" value="Enviar" />
</p>

<input name="recipient" type="hidden" id="recipient" value="[correo eliminado]" />

<input name="subject" type="hidden" id="subject" value="Contacte web auraioga" />
</div>

</div>
</div>

<div id="formato2c2">
<p class="titular">Activitats que interessen:</p>

<input type="checkbox" name="ioga" id="ioga" />
<label for="ioga" class="subtitular">Ioga</label>
</p>

<input type="checkbox" name="ioganens" id="ioganens" />
<label for="ioganens" class="subtitular">Ioga per a nens</label>
</p>

<input type="checkbox" name="ky" id="ky" />
<label for="ky" class="subtitular">Katsugen - Yuki</label>
</p>

<input type="checkbox" name="txikung" id="txikung" />
<label for="txikung" class="subtitular">Txi Kung</label>
</p>

<input type="checkbox" name="formacio" id="formacio" />
<label for="formacio" class="subtitular">Formació de professors</label>
</p>
<p class="subtitular">
<input type="checkbox" name="sem" id="sem" />
<label for="sem">Seminaris</label>
</p>
<p class="subtitular">
<input type="checkbox" name="pnl" id="pnl" />
<label for="pnl">PNL</label>
</p>
<p class="subtitular">
<input type="checkbox" name="sup" id="sup" />
<label for="sup">Suport personal</label>
</p>
</div>
</form>

</div>
<div id="pie">
<ul>

C/Pompeu Fabra 13 2 1-2

08242 Manresa

938720951

[correo eliminado]

</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>

El código CSS:

body {
background-color: #FFFFFF;
font-family: Geneva, Arial, Helvetica, sans-serif;
width: 780px;
margin-right: auto;
margin-left: auto;
text-decoration: none;
}
body2 {
background-color: #FFFFFF;
font-family: Geneva, Arial, Helvetica, sans-serif;
width: 300px;
margin-right: auto;
margin-left: auto;
text-decoration: none;
}
.subfoto2 #horario2c {
height: 500px;
width: 300px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
font-weight: bold;
color: #FFFFFF;
}
.subfoto2 #horario2ca {
height: 400px;
width: 400px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
font-weight: bold;
color: #FFFFFF;
}
.subfoto2 #func {
height: 500px;
width: 600px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
font-weight: bold;
color: #FFFFFF;
padding: 0px;
margin: 20px;
}

#container {
background-color: #FFFFFF;
}

#container #cabecera {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: xx-large;
color: #FFFFFF;
background-color: #CCCC99;
line-height: 50px;
padding: 10px;
letter-spacing: 0.8em;
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #FFFFFF;
text-decoration: none;
}
#container #cabecera2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: xx-large;
color: #FFFFFF;
background-color: #FFFFFF;
line-height: 50px;
padding: 10px;
letter-spacing: 0.8em;
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #FFFFFF;
text-decoration: none;
}

#container #menu {
font-family: Arial, Helvetica, sans-serif;
height: 27px;
color: #333300;
background-color: #A4C2C2;
}
#container #todo img {
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: solid;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
border-bottom-style: solid;
}

#container #contenido {
font-family: "Times New Roman", Times, serif;
background-color: #FFFFFF;
float: left;
margin-top: 0px;
}
#container #contenido #esplogo {
font-family: Georgia, "Times New Roman", Times, serif;
height: auto;
color: #333300;
float: left;
width: 300px;
background-color: #A4C2C2;
}
#container #contenido #esplogo #frase {
color: #006699;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
margin-bottom: 10px;
font-weight: bold;
margin-top: 5px;
margin-right: 5px;
margin-left: 5px;
}

#container #contenido #esppres {
margin-left: 20px;
float: right;
margin-right: 20px;
height: auto;
width: 404px;
}
#container #contenido #esppres #destacats1 {
float: left;
width: 128px;
padding-right: 3px;
padding-left: 3px;
}
#container #contenido #esppres #destacats2 {
float: left;
width: 128px;
padding-right: 3px;
padding-left: 3px;
}
#container #contenido #esppres #destacats3 {
width: 128px;
float: right;
padding-right: 3px;
padding-left: 3px;
}
#container #todo #formato2c1 {
height: auto;
width: 380px;
float: left;
}
#container #todo #formato2c2 {
height: auto;
width: 380px;
float: right;
}
#container #todo #formato3c1 {
height: auto;
width: 260px;
float: left;
}
#container #todo #formato3c2 {
height: auto;
width: 260px;
float: left;
}
#container #todo #formato3c3 {
height: auto;
width: 260px;
float: right;
}

#container #todo #contenido #esppres #volver {
display: block;
cursor: pointer;
background-color: #A4C2C2;
color: #333300;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
vertical-align: bottom;
float: right;
width: 420px;
background-position: bottom;
position: relative;
visibility: hidden;
}
#container #todo #contenido #esppres #volver li {
list-style-type: none;
margin-right: 10px;
margin-left: 10px;
height: auto;
display: inline;
}
#container #todo #todolista {
float: left;
}
#container #todo #fotolista {
float: left;
height: 170px;
width: 110px;
clear: both;
padding-top: 10px;
padding-right: 20px;
padding-bottom: 10px;
padding-left: 0px;
}
#container #todo #contenidolista {
float: right;
width: 610px;
padding: 10px;
}

#container #volver {
background-color: #A4C2C2;
clear: both;
color: #333300;
height: 25px;
vertical-align: middle;
line-height: 25px;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: solid;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
font-weight: normal;
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
}

#container #volver li {
list-style-type: none;
margin-right: 10px;
margin-left: 10px;
height: auto;
display: inline;
}
#container #todo #titularpie {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: large;
color: #CC3300;
letter-spacing: 0.1em;
margin-bottom: 5px;
text-align: center;
width: 780px;
float: left;
}

#container #pie {
clear: both;
color: #FFFFFF;
height: 40px;
vertical-align: middle;
line-height: 40px;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: solid;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
font-weight: normal;
background-color: #CCCC99;
}

#container #pie li {
list-style-type: none;
margin-right: 10px;
margin-left: 10px;
height: auto;
display: inline;
}

a:link {
text-decoration: none;
color: #333300;
}
a:visited {
text-decoration: none;
color: #006699;
}

a:hover {
font-weight: normal;
text-decoration: none;
}
a {
text-decoration: none;
}

ul {
margin: 0px;
padding: 0px;
list-style-type: disc;
display: inline;
}
li {
list-style-type: none;
margin-right: 10px;
margin-left: 10px;
height: auto;
}
.rotulo {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: xx-large;
color: #FFFFFF;
background-color: #CCCC99;
}

.titular {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: large;
color: #CC3300;
letter-spacing: 0.1em;
margin-bottom: 5px;
}
.subtitular {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: medium;
color: #408080;
letter-spacing: 0.0em;
padding-top: 6px;
}
.subtitularojo {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: small;
color: #CC3300;
letter-spacing: 0em;
margin-bottom: 5px;
}

.detall {
line-height:20px;
color:#333333;
font-family: arial;
font-size: small;
text-align: justify;
}
.detallfi {
line-height:15px;
color:#333333;
font-family: arial;
font-size: small;
text-align: justify;
}

.subfoto {
font-family: Arial, Helvetica, sans-serif;
color: #006699;
text-align: center;
font-weight: bold;
}

.subfoto2 {
font-family: Arial, Helvetica, sans-serif;
color: #006699;
text-align: center;
font-weight: normal;
line-height: normal;
font-size: small;
}
.subfotogran {
font-family: Arial, Helvetica, sans-serif;
color: #006699;
text-align: center;
font-weight: normal;
background-color: #A4C2C2;
font-size: medium;
letter-spacing: 0.2em;
width: 780px;
}
.subtitulartabla {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: small;
color: #408080;
letter-spacing: 0.1em;
padding-top: 6px;
}
.detalltabla {
line-height:16px;
color:#333333;
font-family: arial;
font-size: small;
text-align: justify;
letter-spacing: 0em;
list-style-type: none;
font-weight: normal;
}
.volver {
display: block;
cursor: pointer;
color: #333300;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
vertical-align: bottom;
float: right;
width: 420px;
background-position: bottom;
position: relative;
list-style-type: none;
margin-right: 10px;
margin-left: 10px;
height: auto;
display: inline;
}
.volver li {
list-style-type: none;
margin-right: 10px;
margin-left: 10px;
height: auto;
display: inline;
}
.formnom {
font-family: Arial, Helvetica, sans-serif;
color: #333300;
font-weight: normal;
background-color: #A4C2C2;
font-size: medium;
letter-spacing: 0.1em;
float: none;
margin-left: 40px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 8px;
}
.formcnom {
font-family: Arial, Helvetica, sans-serif;
color: #333300;
font-weight: normal;
background-color: #A4C2C2;
font-size: medium;
letter-spacing: 0.1em;
float: none;
margin-left: 2px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 8px;
}
.formemail {
font-family: Arial, Helvetica, sans-serif;
color: #333300;
font-weight: normal;
background-color: #A4C2C2;
font-size: medium;
letter-spacing: 0.0em;
float: none;
margin-left: 32px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 8px;
}
.formtlf {
font-family: Arial, Helvetica, sans-serif;
color: #333300;
font-weight: normal;
background-color: #A4C2C2;
font-size: medium;
letter-spacing: 0.1em;
float: none;
margin-left: 16px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 8px;
}
.formadr {
font-family: Arial, Helvetica, sans-serif;
color: #333300;
font-weight: normal;
background-color: #A4C2C2;
font-size: medium;
letter-spacing: 0em;
float: none;
margin-left: 22px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 8px;
}
.formobs {
font-family: Arial, Helvetica, sans-serif;
color: #333300;
font-weight: normal;
background-color: #A4C2C2;
font-size: small;
letter-spacing: 0em;
float: none;
margin-left: 10px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 8px;
}

Gracias.

pitufo · 14 Nov 2008, 02:01 · Solicitar retirada

Hola.

Copie los códigos HTML y CSS para ver tu pagina, pero no se visualiza correctamente, creo que es por que falta el código javascript. :D

Creo que seria mejor que la subieras a algún hosting temporal para poderla visualizar correctamente.

Bye. ;)

suitangi · 14 Nov 2008, 11:28 · Solicitar retirada

Hola de nuevo,

He subido la página en modo de prueba para que puedas probarla:

http://www.aura-ioga.com/proves/index.html

Saludos y gracias

pitufo · 14 Nov 2008, 13:06 · Solicitar retirada

El problema es que no muestra el color de fondo.

Trata de ponerle un height: 100px; en la #cabecera de tu hoja de estilos.

Bye.

suitangi · 14 Nov 2008, 19:51 · Solicitar retirada

gracias pitufo, con eso parece que resolvi la cabecera.

tengo otro problema con el formulario de contacto ("contacte" en la pagina), tambien hecho desde dreamweaver, no sé si podemos continuar este hilo o es mejor que publique uno nuevo.

Por si acaso te informo: He utilizado formmail pero algo no he hecho bien ya que como puedes comprobar sale:

Internal Server Error
The server encountered an internal error or misconfiguration and was unable to complete your request.

Please contact the server administrator, [correo eliminado] and inform them of the time the error occurred, and anything you might have done that may have caused the error.

More information about this error may be available in the server error log.

Sabes que puede ser?

Gracias de nuevo.

suitangi · 15 Nov 2008, 01:46 · Solicitar retirada

tambien resuelto.

gracias por todo.

pitufo · 15 Nov 2008, 01:56 · Solicitar retirada

suitangi escribió:tambien resuelto.

gracias por todo.

De nada ;)