Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Problema con tamaño de un div

Estas en el tema de Problema con tamaño de un div en el foro de CSS en Foros del Web. hola que tal, tengo un problema al darle el tamaño de alto de un div, estoy trabajando con porcentajes, tengo este código de mi div ...
  #1 (permalink)  
Antiguo 04/11/2013, 14:19
 
Fecha de Ingreso: febrero-2011
Mensajes: 138
Antigüedad: 13 años, 2 meses
Puntos: 6
Pregunta Problema con tamaño de un div

hola que tal, tengo un problema al darle el tamaño de alto de un div, estoy trabajando con porcentajes, tengo este código de mi div

Código HTML:
Ver original
  1. <div class = "contenedor contenedor-sombra sombra1 sombra2"></div>

y esté es mi código CSS

Código CSS:
Ver original
  1. .contenedor {
  2.     background-color: #f4f4f4;
  3.     width: 50%;
  4.     height: 50%; /*AQUÍ NO FUNCIONA, SOLO SI LO PONGO EN PX SI PERO YO QUIERO EN %*/
  5. }
  6.  
  7. .contenedor {
  8.     background-color: #f4f4f4;
  9.     position: absolute;
  10.     width: 50%;
  11.     height: 80%;
  12. }
  13.  
  14. .contenedor-sombra {
  15.     position: relative;
  16.     float: left;
  17.     padding: 1em;
  18.     margin: 10px 30px 0;
  19.     -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  20.     -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  21.     box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  22. }
  23.  
  24. .contenedor-sombra:before, .contenedor-sombra:after {
  25.     content: "";
  26.     position: absolute;
  27.     z-index: -2;
  28. }
  29.  
  30. .sombra1:before {
  31.     top: 10px;
  32.     bottom: 10px;
  33.     left: 0;
  34.     right: 50%;
  35.     -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.6);
  36.     -moz-box-shadow: 0 0 15px rgba(0,0,0,0.6);
  37.     box-shadow: 0 0 15px rgba(0,0,0,0.6);
  38.     -moz-border-radius: 5px / 100px;
  39.     border-radius: 5px / 100px;
  40. }
  41.  
  42. .sombra2:before {
  43.     right: 0
  44. }

el problema es que solo le asigna el ancho en % pero el alto no funciona(solo funciona con px) lo que necesito es que tanto el ancho como el alto sean en %, espero y puedan ayudarme, saludos de antemano.
__________________
-A veces las cosas pequeñas nos hacen grandes problemas, las cuales no son cosas imposibles de resolver-
  #2 (permalink)  
Antiguo 04/11/2013, 16:40
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: Problema con tamaño de un div

Anchos y altos son siempre relativos a sus contenedores, y si no hay una altura especificada en el padre —es decir, que esta es height: auto (valor por defecto)— entonces tendrá obviamente una altura automática relativa a su contenido.

Supongo que ese será el problema. Tendrás que definir una altura al elemento que contenga al que quieres darle una altura porcentual.
  #3 (permalink)  
Antiguo 22/11/2013, 01:56
 
Fecha de Ingreso: febrero-2011
Mensajes: 138
Antigüedad: 13 años, 2 meses
Puntos: 6
Respuesta: Problema con tamaño de un div

ese era el problema, puse este código.

Código HTML:
Ver original
  1. body {
  2.   height: 100%;
  3.   width: 100%;
  4. }

y con eso funciono jejeje gracias
__________________
-A veces las cosas pequeñas nos hacen grandes problemas, las cuales no son cosas imposibles de resolver-

Etiquetas: tamaño
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 10:43.