Problema con capas y 3 columnas

[jesusbet]

tengo una página y la he maquetado así:


la cuestión es que yo la quiero así:


en la css tengo:
#contenido {position: relative; background-image: url(imagen.gif); background-repeat: no-repeat; top: -30px; width: 443px; height: 311px; left: 7px;}

#sidebar2 {position: relative; width: 135px; font-size: 10pt; background-color: #F4F4F4; text-align: center; right: 7px; top: 5px; border: solid 2px #ffffff;}
#sidebar2_dentro {position: relative; width: 135px; z-index: 10; height: 220px; float: right;}

donde #sidebar2_dentro es un div que está dentro de el div #sidebar2... el div #sidebar2 está dentro de #cuerpo, pero #menu esta fuera de #cuerpo... a ver si me'xpliqué bien ^^....


gracias

[dlg]

fijate en este codigo:

Código:

<div id="izquierda" style="float:left; width:150px; margin-top:20px;">izquierda
<div id="centro" style="float:left; width:150px;">centro
<div id="derecha" style="float:left; width:150px; margin-top:20px;">derecha

Espero que te sirva.

Un saludo

[jesusbet]

el problema es que MENU (izquierda) está fuera del contenido principal, es decir, los otros dos están agrupados en otro div.

saludos

[dlg]

pues entonces es lo mismo. Solo tienes que meter izquierda y derecha en otro div:

Código:

<div id="lateral">
<div id="izquierda" style="float:left; width:150px; margin-top:20px;">izquierda</div>
<div id="centro" style="float:left; width:150px;">centro</div>
</div>
<div id="derecha" style="float:left; width:150px; margin-top:20px;">derecha</div>

A lo mejor no te estoy entendiendo bien.

Un saludo

[jesusbet]

jeje... gracias.. orita pruebo...

[jesusbet]

tengo la siguiente css:

Código:

#cuerpo {
	position: relative;
	width: 480px;
	float: left;
}

#menu {
	position: relative; 
	width: 155px; 
	overflow: hidden;
	float: left;
	background-color: #ffffff;
}

#noticias {
	position: relative;
	width: 443px;
	height: 311px;
}

#login {
	position: relative;
	width: 100px;
	padding-left: 640px;
}

donde #cuerpo contiene todo, noticias es la capa principal, #menu es la capa de la izquierda y #login es la capa de la derecha, ésta última se me tira hacia abajo.

gracias

[Remo:Erdosain]

155 + 443 + 100 = 698
698 > 480

Las tres columnas no te van a entrar en ese ancho de #cuerpo.

[TheGhost]

Fijate en algo jesusbet...dices que #cuerpo contiene #menu, #login y #noticias dentro suyo. #cuerpo tiene como width 480px y si los demás estan adentro, deberían sumar sus width's 480px, lo cual no sucede, por eso login se te va para abajo.
Intenta de que la suma de las width's de menu, login y noticias, sea 480px

Post-editado: xDD con un minuto de diferencia Remo:Erdosain
Para agregar, que si aún asi no te funciona...quitale los position:relative y a #noticias agregale solo el position:absolute


Saludos
The Ghost

[jesusbet]

sabes una cosa??? tienes razón, menú está FUERA de cuerpo, y dentro de cuerpo está noticias y login...

[jesusbet]

el problema es que en firefox va bien, pero en internet explorer no...

[dlg]

Supongo que tu problema es que en IE las columnas se quedan unas debajo de otras y en firefox en cambio, se quedan bien, es decir, se quedan una al lado de la otra. Esto es debido a un error del navegador de bill que deja un margen de unos 3 pixels no se sabe por que entre capa y capa. Para solucionar esto sin resignarte al mandato del señor bill, puedes hacer uso de uno de los muchos fallos de IE y es utilizar este codigo:

Código:

* html #capa {
	 width: de 3 a 5 pixels menos que el real
}

Este codigo css es totalmente valido y solo lo coje IE.

Un saludo

[jesusbet]

anda la osa, no sabía esa... grax, orita lo pruebo...

saludos