Question

The various content DIVs show up in a slideshow style (I’m using Malsup’s Cycle plugin) a single one at a time, but have differing heights (individually, and at different times the largest height may be different). The news div has the height of the highest content DIV. I would like to center the content DIVs vertically within the news DIV. Is there a simple way to do this with CSS? Or should I use jquery to calculate the height of newsWrapper, subtract the newsNav heights, and news from it, halve that and then add it as margin-top for each of the content DIVs?

<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>

Answer 1

“Or should I use jquery to calculate the height of newsWrapper, subtract the newsNav heights, and news from it, halve that and then add it as margin-top for each of the content DIVs?”

This. Padding-top works too.