div with content overflowing container

[BarryC]

I have an <article> element with three children: a header, a content div, and a footer. The article is absolutely positioned with height and width set, so that it fits nicely into a grid of articles. The header has some variable content, such as the article title, date, etc. and is allowed to expand as it needs. The footer is absolutely positioned within some space set aside in the article by padding the bottom of the article. The content div, however, refuses to play nicely.What's happening is that the grid_content div just takes up however much space it needs to accommodate its content, overflowing the <article> element as it does so. I'd figure out some explicit height to set on it, but both the <article> height and the header height are variable, depending on how many spaces it takes up in the grid and what the article title is, respectively.Is there some clean way to get the div to respect its containment, or will I need to do some ugly JS hacks to get it to stay put?Thanks!http://jsfiddle.net/j2fE4/