Foros del web, para los que viven de bits

Hola!

Estoy siguiendo el tutorial de Maquetación css de "desarrolloweb", y estoy haciendo un diseño a 3 columnas. El caso es que funciona bien, hasta que en los "menús" laterales pongo el tercer submenú, que me lo mete en la columna del centro, y no sé por qué.

Podéis ayudarme?

PD: adjunto código CSS. Como veréis, es muuy parecido al del tutorial

Gracias!

El código de la página es:

-------------

<div id="contenedor">
<div id="cabecera"><img src="images/coetc.gif" width="700" height="81" alt="COETC" border="0"></div>
<div id="navegador">
<a href="/organitzacio/historia.htm" class="enlacenav">Organitzaci&oacute;</a> |
<a href="/serveis/serveis.htm" class="enlacenav">Serveis</a> |
<a href="/Ex_Prof/index_ELP.htm" class="enlacenav">Exercici de la Professi&oacute;</a> |
<a href="/activitats/cursos.htm" class="enlacenav">Activitats</a> |
<a href="/diversos/publicacions/public_acet.htm" class="enlacenav">Diversos</a> |
<a href="/foro" class="enlacenav">Foro</a>
</div>
<div id="cuerpo">
<div id="izquierda">
<h2 class="titlat">Agenda</h2>
<div id="evento1" class="cuerpolateral">
<div id="tipoevento" class="tipoevento">
Curso
</div>
<div id="descripcion" class="descripcionevento">
<a href="http://www.google.es">mira el google</a>
</div>
<div id="fechaevento" class="fechaevento">
cuando quieras, en tu navegador!
</div>
</div>
<div id="evento2" class="cuerpolateral_gris">
<div id="tipoevento" class="tipoevento">
Concurso
</div>
<div id="descripcion" class="descripcionevento">
<a href="http://www.google.es">Concurso de fotograf&iacute;a</a>
</div>
<div id="fechaevento" class="fechaevento">
por la calle!
</div>

</div>
</div>

<div id="centro">
centro
</div>
<div id="derecha">
<h2 class="titlat">Seccions d'interès</h2>
<div id="info" class="m_derecho">
<a href="#">&middot; Info, contacte i horaris</a>
</div>
<div id="info" class="m_derecho_gris">
<a href="#">&middot; Col&middot;legiar-se o associar-se </a></div>
</div>

</div>

</div>

----------------

Y el CSS es:

-------------
/* estilos para página principal */

/* ENLACES SÓLO para 'navegador'*/
A.enlacenav, A.enlacenav:VISITED, A.enlacenav:ACTIVE, A.enlacenav:FOCUS, A.enlacenav:LINK{
font-weight:normal;
}
A.enlacenav:HOVER{
text-decoration:underline;
}

/* ENLACES SÓLO para 'cuerpo'*/
#cuerpo A, A:VISITED, A:ACTIVE, A:FOCUS, A:LINK{
text-decoration: none;
font-weight:bold;
color: #000000;
}
#cuerpo A:HOVER{
text-decoration: none;
font-weight:bold;
color: #FFCC00;
}

#derecha A, A:VISITED, A:ACTIVE, A:FOCUS, A:LINK{
text-decoration: none;
font-weight:normal;
color: #000000;
}
#derecha A:HOVER{
text-decoration: underline;
font-weight:normal;
color: #FFCC00;
}

BODY {
background : #FFFF99;
font : 8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
color : #666666;
margin : 20px 0px 20px 0px;
text-align: center;
}

#contenedor{
text-align: left;
border: 2px solid #ffff00;
width: 700px;
background-color : #ffffff;
margin: auto;
}


#cabecera{
height : 81px;
width: 700px;
}

#navegador{
background : #ffffff url(images/fondonav.gif);
padding : 8px 10px 8px 10px;
border-top : 1px solid #cccccc;
border-bottom : 1px solid #cccccc;
width: 700px;
}


#cuerpo{
/*mantenemos el color del BODY, ya lo cambiaremos en las demás capas si toca*/
width:700px;
}

#izquierda{
width:175px;
padding: 0px 0px 0px 0px;
background-color : #ffffff;
float:left;
}

#centro{
width:350px;
padding: 0px 0px 0px 0px;
float:left;
}

#derecha{
width:175px;
padding: 0px 0px 0px 0px;
background-color : #ffffff;
float:right;
}

/* estilos para menu IZQUIERDO de main */
.titlat{
background-color:#0066CC;
color:#ffffff;
font-size:8pt;
text-transform : uppercase;
padding: 7px 3px 7px 8px;
font-weight : bold;
letter-spacing : 2px;
margin: 0px 0px 8px 0px;
}

.cuerpolateral{
padding: 0px 4px 13px 0px;
border-right: 2px solid #0066CC;

}
.cuerpolateral_gris{
background-color:#e4e4e4;
padding: 0px 4px 13px 0px;
border-bottom: 2px solid #0066CC;
}
.tipoevento{
color:#FF9933;
font-weight:bold;
padding-bottom: 15px; /*margen por debajo*/
padding-top: 5px;
}

.descripcionevento{
/* solo definimos el margen inferior*/
padding-bottom: 15px;
padding-left:4px;
}

.fechaevento{
/* solo definimos el margen inferior*/
padding-bottom: 5px;
padding-left:4px;
}

/* parte derecha */

.m_derecho{
padding: 7px 4px 7px 5px;

}
.m_derecho_gris{
background-color:#e4e4e4;
padding: 7px 4px 7px 5px;
}

-------------

Tenés alguna dirección donde podamos verlo andando (no quiero andar creando el HTML y todo el rollo) para ver bien el fallo?

En qué navegadores lo probaste? (a veces son los navegadores los molestos...sobre todo IE siempre tiene problemas)

Saludos

Hola, El Barto.

Mañana lo subo a Internet y lo puedes ver. De todas formas, ya sale mal en el DreamWeaver, con que no es el navegador....

Aquí está el enlace: http://ccc.1asphost.com/evarove/porquepasa.asp

Luego seguir el link del medio para ver el ERROR. O mirad directamente en
http://ccc.1asphost.com/evarove/porquepasa2.asp

No se si sera la causa, pero en la seccion derecha tienes 3 divs con el mismo id, lo que es un error. El id debe ser un valor unico.

Hola, darkJ.

Pues va a ser que no es eso.... lo he cambiado y sigue igual.

Ya, pero sigue siendo un error repetir los id.

Al final el problema es que esta haciendo lo que le has mandado hacer, pero que no es lo que querias hacer:Supongo que habra sido un error al copipastear, ayudado por un estilo no uniforme al poner las etiquetas de cierre (unas al final de la misma linea, otras en linea aparte). Pero la cuestion es que despues de la segunda opcion cierras el div id="derecha".