CSS vertical align inside a min-height container?

As far as I know there is absolutely no way to get this done in IE7 with just CSS, unless you can live with a table. For all decent browsers, and IE8, you can use display:table-cell:

http://jsfiddle.net/hGjfY/

and

• set height to 200px instead of min-height (min-height is not supported on table cells, height is interpreted as min-height)

• add conditional comment to target only IE7, and add min-height:200px; and height:auto; to the inner div (height doesn't work as expected in IE7 on table cells)

• load jQuery fix only for IE7, or live with a non-centered view in IE7

Here is a CSS-only approach using the HTML your provided on jsfiddle. It does require two wrapper DIVS around your content, but you already had that in your HTML. This solution does not use tables or table cells, but DIVS that act like tables and table cells using CSS.

Here is your jsfiddle modified and working: http://jsfiddle.net/8Mjc3/2/

HTML

<div class="vertical-center-container">
  <div class="vertical-center-table-cell">
    <!-- INSERT CONTENT TO BE VERTICALLY ALIGNED -->
  </div>
</div>

CSS

.vertical-center-container {
    display: table;
    width:100%;
}
.vertical-center-table-cell {
    display: table-cell;
    vertical-align: middle;
}

This is a modified solution using what I learned about vertical alignment using the Table Cell Method from a Smashing Magazine article.

The @ptriek answer is good but if you also want to get the center horizontal alignment than you need to have an extra wrapper and set it as

.outer{ 
    display: table; 
    width: 100%
}
.inner{
    diplay: table-cell;
    vertical-align: middle;
    height: 200px;
    text-align:center;
}