establecer una pantalla con menu izquierdo y derecho

erick_arcini · #1 (**permalink**) 24/04/2007, 17:10

Holas, espero que no fastidie con esta pregunta que muchos, yo creo, ya han formulado, pero bue... tengo el siguiente script

Código:

<html>
<head>
<style>
*
{
 padding:0;
 margin:0;
}
body
{
 padding:0;
 margin:0;
 background-color:#E5E5E5;
 font-family:Trebuchet MS;
}

div
{
 text-align:center;
 width:70%; 
 margin:auto;
}

#arriba
{
 background-color:darkred;
 color:white;
}

#contenido
{
 background-color:#E5E5E5;
 color:white;
}

#pie
{
 background-color:darkred;
 color:white;
}

#menuIZQ
{
 float:left;
 width:20%;
 background-color:darkred;
 color:whtite;
}

#menuDER
{
 float:rigth;
 width:20%;
 background-color:darkred;
 color:white;
 clear:left;
}

</style>
</head>
<body>
	<div id="arriba">
		ARRIBA
	</div>
	<div id="contenido">
		<div id="menuIZQ">
			menu izquierdo
		</div>
		<div id="menuDER">
			menu derecho
		</div>
	</div>
	<div id="pie">
		ABAJO
	</div>
</body>
</html>

el cual quiero que haga una pantalla semejante más o menos a la de la imagen pero el div del menú derecho me lo coloca por debajo es decir, como que da un salto de linea, como le puedo hacer para que me quede un menú de un lado, el contenido de mi información en el centro y otro menú en el lado derecho, espero me haya dado a entender.

Saludos.

floren · #2 (**permalink**) 24/04/2007, 23:34

Siempre es mejor un link donde ver lo que estás implementando; de entrada tienes mal escrito

#menuDER
{
float:rigth;

También te sugiero que lo que es contenido, lo que será el texto, esté en una capa independiente ya que eso le dará más flexibilidad a tu diseño, así lo que tú llamas "contenido" debería contener tres capas en lugar de dos.

Espero te sirva.

erick_arcini · #3 (**permalink**) 25/04/2007, 10:34

Cita:

Iniciado por floren

Siempre es mejor un link donde ver lo que estás implementando; de entrada tienes mal escrito

#menuDER
{
float:rigth;

...

Gracias por contestar, acerca de lo primero, si, se que estuvo mal escrito ya que estoy ocupando el bloc de notas para hacer mi código, por que si lo hago en un editor me va a hacer la vida más fácil y lo que quiero es aprenderlo bien.

Cita:

También te sugiero que lo que es contenido, lo que será el texto, esté en una capa independiente ya que eso le dará más flexibilidad a tu diseño, así lo que tú llamas "contenido" debería contener tres capas en lugar de dos.

Espero te sirva.

esta parte si no te entendí

y con lo respecto a ver el sitio, aún no he comprado algún web hosting por que no tiene caso que haga el gasto y eso aun no este el sitio, es por eso que lo estoy haciendo primero local probando en los 3 navegadores principales FF IE6 e IE7 y hasta ahorita no he tenido problemas al respecto.

floren · #4 (**permalink**) 25/04/2007, 12:46

En tu código

Código HTML:

<div id="contenido">
		<div id="menuIZQ">
			menu izquierdo
		</div>
		<div id="menuDER">
			menu derecho
		</div>
	</div>

entiendo que entre izquierdo y derecho irá algo, digamos el cuerpo de la web; eso es lo que te recomiento que vaya en otra capa:

Código HTML:

<div id="contenido">
		<div id="menuIZQ">
			menu izquierdo
		</div>
                <div id="cuertp">
			<p>Texto</p>
                        <p>Más Texto</p>
		</div>

		<div id="menuDER">
			menu derecho
		</div>
	</div>

Saludos!