要素の縦横センタリング

寄せる要素のサイズが分かる時

50%の位置に固定させ、要素のサイズの半分だけネガティブマージンで飛ばすだけ。
※要素はwidth:200px; height:100px;と仮定

.hoge {
    margin-top: -50px;
    margin-left: -100px;
    position: fixed;
    top: 50%;
    left: 50%;
}

寄せる要素のサイズが不明の時（IE8以降）

ゴーストエレメント使って高さが100%の要素を作り、それに対して vertical-align: middle; で真ん中に飛ばすべし。

.hoge {
    text-align: center;
    background: #eee;
    height: 500px;
}
.hoge:before {
    vertical-align: middle;
    content: '';
    display: inline-block;
    height: 100%;
    margin-right: -0.4em; /* スペースの調整 */
}
.center {
    vertical-align: middle;
    display: inline-block;
}​

<div class="hoge">
    <div class="center">
        <h1>真ん中に寄りなさい。</h1>
        <p>ほら、早く真ん中にお寄りなさい。</p>
    </div>
</div>

寄せる要素のサイズが不明の時（IE7にも対応）

不本意ながら、ゴーストエレメント（空のspan要素）やスターハックを使用。IE7め…

.hoge {
    text-align: center;
    vertical-align: middle;
    display: block;
    height: 500px;
    background: #eee;
    letter-spacing: -0.4em;  /* inline-blockの隙間対策 */
}
.hoge * {
    vertical-align: middle;
    display: inline-block;
    height: 100%;
    *display: inline;  /* IE7用ハック */
    *zoom: 1;          /* IE7用ハック */
    letter-spacing: normal;  /* inline-blockの隙間対策 */
}
.center {
    vertical-align: middle;
    height: auto;
}

<div class="hoge">
    <span></span>
    <p class="center">真ん中に寄りなさい。</p>
</div>