Comunidad de diseño web y desarrollo en internet online

3 columnas CSS

Citar            
MensajeEscrito el 17 Oct 2009 09:32 pm
Hola gente!!!, les escribo porque hace rato que estoy buscando respuesta a este tema y no puedo encontrarla... probe varios consejos y ninguno se adapta exactamente a lo que quiero y, por otro lado, no suelen tener compatibilidad con ciertos navegadores.

Les explico: lo que necesito hacer es un sitio con 3 columnas en un contenedor con ancho fijo de 955px. Las columnas tendrian un ancho fijo pero, en este caso, no importa demasiado la medida de cada una. Lo que me esta complicando es que necesito que las tres tengan un 100% de alto. Es decir, que sea cual fuere la resolucion, mantengan ese 100% de alto.

Les paso una imagen como para que sea mas claro ( http://sitioamedida.com.ar/pic.jpg" ).

Si me pueden dar una mano con esto, se los agradeceria infinitamente!!!!!!!!!!

Saludos a todos y, desde ya gracias!!!.

Por roma76

7 de clabLevel



 

msie7
Citar            
MensajeEscrito el 18 Oct 2009 04:06 pm
Se soluciona como se haría con 2 columnas... El problema llega con los fondos. Con css2 no vas a poder hacer que las tres columnas lleguen relamente hasta abajo (aunque puedes simularlo para lo que haya más abajo con un clear:both;). Una de las solucionas más sencillas és crear un fondo que simule las tres columnas para ponerlo al div que las contenga. Hay más soluciones (algunas en java script, por si interesa....). Pero solo con css NO vas a poder hacer tres columnas cada una con un fondo y que lleguen los tres fondos hasta abajo. PUNTO.

Hasta pronto Roma ;)

Por jackbach

Claber

196 de clabLevel

1 tutorial

 

Barcelona

firefox
Citar            
MensajeEscrito el 18 Oct 2009 05:57 pm
Hola Jack Bach!, gracias por tu rapida respuesta!.
En realidad lo que necesito es que la columna central tenga un fondo pero las de la izquierda y la derecha no lo tendrian, habria solo contenido en ellas.
Cualquier solucion me viene bien siempre que sean 3 divs separadas porque busco y busco y no logro encontrar nada parecido y como recien empiezo con css se me complica un poco mas.
Nuevamente mil gracias y si podes darme una mano con esto, bueniiiisimo!.

Por roma76

7 de clabLevel



 

msie7
Citar            
MensajeEscrito el 18 Oct 2009 07:11 pm
ok, allá vamos:

HTML:

Código HTML :

<div id="contenedor">
   <div id="columna1">
   </div><!-- fin columna1-->
   <div id="columna2">
   </div><!-- fin columna2-->

   <div id="columnaprincipal">
   </div><!-- fin columna Principal-->
   <div class="clear"></div>
</div>


CSS

Código :

#contenedor {
width: xxxpx;
margin: 0 auto;
padding:0;
}
#columna1, #columna2 {
width: xxxpx;
margin: 0;
}
#columna1{
float: left;
}
#columna1{
float: right;
}
 #columnaprincipal{
width: 100;
background: #eee;
}
.clear {
clear:both;
}


No lo he probado ni lo voy a probar... pero la idea es esa...

Por jackbach

Claber

196 de clabLevel

1 tutorial

 

Barcelona

firefox
Citar            
MensajeEscrito el 19 Oct 2009 03:32 am
No me funciono pero igual gracias, voy a averiguar por otro lado.

Por roma76

7 de clabLevel



 

msie7

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.