css - テーブルの外側のテキストをCSSのテーブルの列に揃えます

Question

9 列のテーブルがあり、列 8 の下に、その列の合計 (変数に格納したもの) を出力したいと考えています。列 8 の下に表示されるようにテキストを揃えるにはどうすればよいですか?

現在、合計は h5 タグに含まれていますが、それで位置合わせが妨げられる場合は、変更したいと考えています。

<table> ...stuff
</table>
<h5>TOTAL!</h5>    <---- this should appear under column 8 of the table

Answer 1

The best route would be to have it in the table itself however if that isn't an option, align your h5 by using javascript. Get the x offset of column 8 and apply that value to your h5. If you can provide a more full example of your markup I can provide an example.

Edit:

Since you didn't provide markup I created an example. You should be able to apply the gist of it to your code.

html

<table>
    <thead>
        <tr>
            <td>head 1</td>
            <td>head 2</td>
            <td id="totalcol">head 3</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>body 1</td>
            <td>body 2</td>
            <td>body 3</td>
        </tr>
    </tbody>
</table>
<p id="total">Some total</p>

js

var left = $('#totalcol').offset().left;
$("#total").css("margin-left",left);

http://jsfiddle.net/H62wV/