Foros del Web » Creando para Internet » CSS »

Div con 100% de alto css

Estas en el tema de Div con 100% de alto css en el foro de CSS en Foros del Web. Hola, esto me está volviendo loco, no soy bueno para el diseño, lo mio es la programación, en fin, creo que la mejor forma de ...
  #1 (permalink)  
Antiguo 02/08/2011, 11:38
Avatar de truman_truman  
Fecha de Ingreso: febrero-2010
Ubicación: /home/user
Mensajes: 1.339
Antigüedad: 6 años, 11 meses
Puntos: 176
Div con 100% de alto css

Hola, esto me está volviendo loco, no soy bueno para el diseño, lo mio es la programación, en fin, creo que la mejor forma de graficar lo que quiero hacer es con una imagen




Bien, lo que quiero es que el div Verde tome el alto del div Gris, independientemente de lo que mida el celeste.


Espero que se entienda
Saludos
Gracias de antemano
__________________
la la la
  #2 (permalink)  
Antiguo 02/08/2011, 12:56
 
Fecha de Ingreso: agosto-2011
Mensajes: 2
Antigüedad: 5 años, 5 meses
Puntos: 0
Respuesta: Div con 100% de alto css

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>Documento sin título</title>
  5. <style type="text/css" >
  6.  
  7. #content{
  8.     width:350px;
  9.     height:500px;
  10. background-color:#CCC;     
  11. }
  12. .celeste{
  13.     background-color:#6FF;
  14.     float:left;
  15.     width:175px;
  16.     height:250px;
  17. }
  18.  
  19. .verde{
  20.     width:175px;
  21.     height:500px;
  22.     float:left;
  23.     background-color:#093;
  24. }
  25.  
  26. </head>
  27.  
  28. <div id="content">
  29. <div class="celeste"></div>
  30. <div class="verde"></div>
  31.  
  32.  
  33. </div>
  34. </body>
  35. </html>
  #3 (permalink)  
Antiguo 02/08/2011, 13:07
Avatar de ZoroRoronoa  
Fecha de Ingreso: marzo-2011
Ubicación: California, USA
Mensajes: 823
Antigüedad: 5 años, 9 meses
Puntos: 116
Respuesta: Div con 100% de alto css

con dimensiones definidas, usas tu.


Pero para que se adapte ponle al .verde position:relative
y un height de 100%.

Saludos.
__________________
Programador jQuery & PHP
  #4 (permalink)  
Antiguo 02/08/2011, 13:12
Avatar de truman_truman  
Fecha de Ingreso: febrero-2010
Ubicación: /home/user
Mensajes: 1.339
Antigüedad: 6 años, 11 meses
Puntos: 176
Respuesta: Div con 100% de alto css

Creo que no se entendió lo que dije o quise decir,

quiero que el verde siempre tenga alto de 100%, siempre......
es decir, que tenga siempre el alto del Gris,

El celeste será variable, en donde se mostrará contenido de la base de datos, esto quiere decir que nunca medirá lo mismo de alto.
__________________
la la la
  #5 (permalink)  
Antiguo 02/08/2011, 13:12
 
Fecha de Ingreso: agosto-2011
Mensajes: 2
Antigüedad: 5 años, 5 meses
Puntos: 0
Respuesta: Div con 100% de alto css

Oni Giri!!!
  #6 (permalink)  
Antiguo 02/08/2011, 13:17
Avatar de truman_truman  
Fecha de Ingreso: febrero-2010
Ubicación: /home/user
Mensajes: 1.339
Antigüedad: 6 años, 11 meses
Puntos: 176
Respuesta: Div con 100% de alto css

Cita:
Iniciado por ZoroRoronoa Ver Mensaje
con dimensiones definidas, usas tu.


Pero para que se adapte ponle al .verde position:relative
y un height de 100%.

Saludos.
No funciona
__________________
la la la
  #7 (permalink)  
Antiguo 02/08/2011, 21:22
Avatar de andresdzphp
Colaborador
 
Fecha de Ingreso: julio-2011
Ubicación: $this->Colombia;
Mensajes: 2.749
Antigüedad: 5 años, 6 meses
Puntos: 793
Respuesta: Div con 100% de alto css

Te dejo un código:

Código CSS:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>Ejemplo</title>
  6.  
  7.         <style type="text/css">
  8.  
  9.             html,body{
  10.                 margin:0px;
  11.                 height:100%;
  12.             }  
  13.             body {
  14.                 text-align: center;
  15.             }
  16.  
  17.             #contenedor {
  18.                 margin: 0 auto;
  19.                 text-align: left;
  20.                 width: 960px;
  21.                 background: #cccccc;
  22.                 height: 1200px;
  23.             }
  24.  
  25.             #celeste, #verde {
  26.                 float: left;
  27.             }
  28.  
  29.             #celeste {
  30.                 background: #009999;
  31.                 width: 500px;
  32.                 margin: 0 20px 0 20px;
  33.                 height: 500px;
  34.             }
  35.  
  36.             #verde {
  37.                 background: #009933;
  38.                 width: 400px;
  39.                 height: 100%;
  40.                 margin-right: 10px;
  41.             }
  42.  
  43.         </style>
  44.  
  45.     </head>
  46.     <body>
  47.  
  48.         <div id="contenedor">
  49.  
  50.             <div id="celeste">
  51.                 Div celeste columna izquierda
  52.             </div>
  53.             <div id="verde">
  54.                 Div verde columna derecha
  55.             </div>
  56.  
  57.         </div>
  58.     </body>
  59. </html>
  #8 (permalink)  
Antiguo 02/08/2011, 23:28
Avatar de truman_truman  
Fecha de Ingreso: febrero-2010
Ubicación: /home/user
Mensajes: 1.339
Antigüedad: 6 años, 11 meses
Puntos: 176
Respuesta: Div con 100% de alto css

Muchas gracias, pero lo solucioné poniendole una imagen de fondo al contenedor

Saludos
__________________
la la la

Etiquetas: 100, alto
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 13:10.