2010-02-19 7 views
12

Tengo un div con 2 elementos.Obtener CSS Div para llenar la altura disponible

<div id="master"> 
     <div id="follower"></div> 
     <div id="decider"></div> 
<div> 

div 'maestro' tiene las siguientes propiedades CSS

height:auto; 
width:auto; 
margin:0; 
padding:10px; 
display:block; 

El div 'seguidor' tiene las siguientes propiedades CSS

position:relative; 

vertical-align:middle; 
height: auto; 

display: inline-block; 

margin-top: 0px; 
margin-bottom:0px; 

El 'decisivo' div decide la altura del ' maestro 'div es. ¿Es posible que el div 'seguidor' ocupe tanto espacio vertical en el div 'maestro' como sea posible?

me trataron height: 100% pero que acaba de hacer el 'seguidor' div ocupar toda la pantalla (vertical)

Respuesta

27

El maestro debe tener

position: relative; 

y luego el seguidor debe tener

position: absolute; 
top: 0; 
bottom: 0; 

Eso debería funcionar, excepto en IE6 (que una cantidad alarmante de personas todavía está usando, pero yo simplemente ignoraría esos y les digo que actualicen su navegador)

+0

Sí funciona. Sin embargo, (al parecer) causó que se ignorara la configuración de bloque en línea en 'seguidor'. – jameszhao00

+2

@ jameszhao00, eso se debe a que un elemento 'position: absolute' se saca del documento-flujo, por lo que no hay nada que pueda estar en línea * con *. –

+4

esto no funciona para divs en celdas de tabla –

Cuestiones relacionadas