Using top: auto, margin: auto, margin-top: -50%, etc, will not work when vertically aligning text within multiple block level elements. The problem with these css declarations in block level elements is that the values would be calculated as zero when they are calculated relative to the width of outer blocks.

CSS2 specifies that block level elements are stacked vertically from top to bottom in normal flow.

If you only have one block level element, the the top and bottom margins will be zero and these declarations will be calculated correctly. For example, the following code will work to vertically align the text:

view plain about
1.slide#slide02 .wrapper {
2    top: auto;
3    left: 5%;
4    text-align: left;
5    padding: 0;
6}

However, if you have more than one block level element in the same flow, the code will not work as the auto margins will not be calculated correctly.

When you're using multiple block level elements, use absolute positioned elements to vertically align the text like so:

view plain about
1.slide#slide02 .wrapper {
2    position: absolute;
3    top: 50%;
4    display: table-cell;
5    vertical-align: middle;
6    left: 5%;
7    text-align: left;
8    padding: 0;
9}