Código HTML:
Ver original
y esté es mi código CSS
Código CSS:
Ver original
.contenedor { background-color: #f4f4f4; width: 50%; height: 50%; /*AQUÍ NO FUNCIONA, SOLO SI LO PONGO EN PX SI PERO YO QUIERO EN %*/ } .contenedor { background-color: #f4f4f4; position: absolute; width: 50%; height: 80%; } .contenedor-sombra { position: relative; float: left; padding: 1em; margin: 10px 30px 0; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .contenedor-sombra:before, .contenedor-sombra:after { content: ""; position: absolute; z-index: -2; } .sombra1:before { top: 10px; bottom: 10px; left: 0; right: 50%; -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.6); -moz-box-shadow: 0 0 15px rgba(0,0,0,0.6); box-shadow: 0 0 15px rgba(0,0,0,0.6); -moz-border-radius: 5px / 100px; border-radius: 5px / 100px; } .sombra2:before { right: 0 }
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.