html - 如何根据溢出元素的宽度将内容居中？

Question

我有一个溢出的表格，我无法按照溢出表格的宽度使标题居中。

打印预览时的查看方式如下:

http://www.mediafire.com/imgbnc.php/37044451cd71d383f8f39dccd88da170690fbc2f22cca0b7afaa3c33279cdcee6g.jpg

请注意标题未居中。正常预览时，页面如下所示:

http://www.mediafire.com/imgbnc.php/787d1776f8e89519630261d0063738ca48fc8404e18c46f380bbea785bfbf9b06g.jpg

我注意到居中对齐与它在屏幕上的显示方式一致。如何使该页面的标题居中？

顺便说一下，这是我的 CSS:

文本东大等

.header {
    width: 100%;
    margin: 0 auto;
    height: auto;
} 

成绩表:

table.grades {
    border-collapse:collapse;
    border: #000 solid 1px;
    font:Arial, Helvetica, sans-serif;
    font-size: 14px;
    margin: 0 auto;
    overflow-x: visible;
    display: inline;
}

Answer 1

body{
    display: table; 
}
.table-grades{
    display: table-cell;
}