Foros del Web » Creando para Internet » CSS »

Ayuda por favor con diseño simple a 3 columnas

Estas en el tema de Ayuda por favor con diseño simple a 3 columnas en el foro de CSS en Foros del Web. Hola, por favor, me estoy volviendo un poco loco con esto que creo es una tonteria. Quiero hacer un diseño simple a tres columnas, de ...
  #1 (permalink)  
Antiguo 01/07/2010, 03:36
 
Fecha de Ingreso: enero-2005
Ubicación: Málaga
Mensajes: 30
Antigüedad: 12 años, 11 meses
Puntos: 1
Ayuda por favor con diseño simple a 3 columnas

Hola, por favor, me estoy volviendo un poco loco con esto que creo es una tonteria.

Quiero hacer un diseño simple a tres columnas, de las cuales, la central tiene un ancho ficho de 980px y las dos laterales se expanden y contraen automáticamente en funcion de la resolucion del usuario.

Código:
<html>
<head>
<style>
#barraBusqueda {
	height:30px;
	text-align:center;
	margin:0 auto 0 auto;
	width:auto;
}
#leftContainerSB {
	float:left;
	background-color:#002E56;
	width: auto;
	height:30px;
	position:relative;
	
}
#mainContainerSB {
	background-color:#cc0000;
	min-width:980px;
	max-width:980px;
	padding:0px;
	margin:0px;
	height:30px;
	width:980px;
	position:relative;
	float: left;	
}
#rightContainerSB {
	float: left;
	background-color:#00CC00;
	margin-right: auto;
	margin-left: auto;
	width: auto;
	height:30px;
	position:relative;
}
</style>
</head>
<body style="vertical-align:top; margin:0px; padding:0px; width:100%">
<div >
  <!-- INICIO BARRA DE BUSQUEDA SUPERIOR -->
  <div id="barraBusqueda" align="center">
    <div id="leftContainerSB"></div>
    <div id="mainContainerSB">ESTO ES EL CENTRO</div>
    <div id="rightContainerSB"></div>
  </div>
  <!-- FIN BARRA DE BUSQUEDA SUPERIOR -->
</div>

</body>
</html>
Lo primero que me ocurre es que no puedo centrar todo el conjunto, y cuando lo centro .... si "contraigo" el navegador.... el centro que tiene ancho fijo, dobla y se mete en la linea de abajo.

Por favor, alguien puede indicarme como hacer esto?, tres columnas, el centro fijo, y los esxtremos auto expandibles, y que cuando se reduzca la pantalla a menos de 980px no se vaya para abajo la capa del centro

MIL GRACIAS.

Un saludo

Última edición por fmorales; 01/07/2010 a las 03:48
  #2 (permalink)  
Antiguo 01/07/2010, 18:45
arawako
Invitado
 
Mensajes: n/a
Puntos:
Respuesta: Ayuda por favor con diseño simple a 3 columnas

De pronto si agregas la propiedad

overflow:hidden;

a #mainContainerSB puedes evitar que el contenido se salga. Aquí puedes ver otras opciones, como barras de desplazamiento:

http://www.w3schools.com/css/pr_pos_overflow.asp

Última edición por webosiris; 01/07/2010 a las 21:39

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 22:51.