Se baja el div

[stardust]

Hola:
He comenzado con CSS y me cuesta mucho aún entender el posicionamiento de las capas. El problema lo podéis ver aquí.

http://juego.stardustmaker.org/java/

En "bien", las capas están en su sitio. El problema es cuando escribo algo en la capa de la derecha: se baja sola (se puede ver en "mal"). En IE explorer se ve bien, pero en Firefox no.

Este es el css:

Código:

body{
background-color: #000;
}

#contenedor{
background-color:#000;
height:516px !important;
width:800px;
background-image: url(fondo.jpg);
background-repeat: no-repeat;
}

#menu{
position:relative;
top:20px;
left:34px;
background-color:#F0F;
height:467px !important;
width:179px;
}
#contenido{
position:relative;
margin-left:247px;
top:-367px;
background-color:#F0F;
height:393px;
width:458px;
}

¿Qué tengo que cambiar para que las capas estén donde están ahora y no se muevan aunque añada texto?

Otra cosa: si escribo un párrafo muy largo, no me lo divide en líneas, sino que me lo muestra del tirón.

Saludos!!

[floren]

Cambia a position:absolute; tanto #menu como #contenido, y en #contenedor colocas un position:relative;