Límite Niño DIV Altura hasta Padres DIV Altura Con Hermano Variable

Question

Tengo un contenedor <div> con una altura especificada, y contiene dos DIV más, para una copia introductoria que variará (ingresada por el cliente) y otra para la lista a cabo varias características.

Quiero que las características <div> llenen automáticamente el espacio restante en el elemento principal, y luego desplace el desbordamiento.

¿Cómo puedo hacer eso?

CSS:

#article { 
    width:940px; 
    height:500px 
} 

#article-content { 
    margin: 20px 0; 
} 

#article-features { 
    height:100%; 
    overflow-x: auto; 
} 

jsFiddle

Answer 1

No hay manera de hacerlo con HTML 4 aparte de depender de JavaScript para cambiar dinámicamente la altura de la parte inferior div basa en el cálculo (parent_height - sibling_height).

Usted puede mirar esto: CSS HTML - DIV height fill remaining space

Con HTML5 se puede utilizar Flexbox utilizar el espacio restante. Tenga en cuenta que existen algunas limitaciones, pero puede responder a sus necesidades. Ver http://caniuse.com/#feat=flexbox.