encontrar el problema de la altura de div y cambiar los márgenes proporcionalmente

Los diversos DIV de contenido se muestran en un estilo de presentación de diapositivas (estoy usando Complemento de ciclo de Malsup) uno a la vez, pero con diferentes alturas (individualmente y en diferentes momentos, la altura más grande puede ser diferente). El news div tiene la altura del contenido más alto DIV. Me gustaría centrar los DIV de contenido verticalmente dentro del news DIV. ¿Existe una forma sencilla de hacer esto con CSS? ¿O debería usar jquery para calcular la altura de newsWrapper, restar el newsNav alturas, y news de él, divide eso por la mitad y luego agrégalo margin-top para cada uno de los DIV de contenido?

<div id="newsWrapper">
  <div id="newsNavTop">
  </div>
  <div id="news">
    <div>Content1</div>
    <div>Content2</div>
    <div>Content etc...</div>
  </div>
  <div id="newsNavBottom">
  </div>
</div>

preguntado el 16 de mayo de 11 a las 20:05

ah proporcionalmente... ha pasado demasiado tiempo. -

2 Respuestas

"¿O debería usar jquery para calcular la altura de newsWrapper, restar las alturas de newsNav y news, reducirlo a la mitad y luego agregarlo como margen superior para cada uno de los DIV de contenido?"

Esta. La parte superior acolchada también funciona.

contestado el 17 de mayo de 11 a las 00:05

puede intentar mostrar esto como tabla.

#news {
    display: table-cell;
    vertical-align: middle;
}

#news > div {
    display: block;
}

http://jsfiddle.net/seler/P23DJ/

no funcionará en ie lte 7

contestado el 17 de mayo de 11 a las 00:05

Pero ... no es una mesa. ¿No es eso semánticamente inapropiado? - un barrio pobre

@aslum es lo que el W3C sugiere hacer en los diseños. - seler

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.