Invoice receipt markup

Prompted by a meta answer, here is an HTML page I'm deliberating over in JSBIN and I would like your review, please.

-
I am not looking to implement the logic, just please focus on HTML & CSS.

-
Are tables a good candidate to mark up purchase items? I've seen this implemented as a list in each column, which I thought was worse.

-
How can I best add markup and style to the final total?

There is a known issue with the CSS border. I'm not asking for you to fix that, but I'm telling you because there is a comment in my code that could possibly make it sound broken. Any other good tips or examples would be great.



td, th { text-align: right; }
tr th:first-child, tr td:first-child { text-align: left; }
tbody tr:last-child td { font-weight: bold; }
table { border-collapse: collapse; }
tbody tr:last-child { border-top: thick black solid; }



Description
Quantity
Rate
Amount




Moon cakes
5
100
500


Super biscuits
1
500
500



Total value

1000




Using a table here is the right choice, however I would put the total into a ` group where you can address its formatting needs specifically. In addition do use colspan="2"` to collapse columns in the total, as well.

StackExchange Code Review Q#106814, answer score: 5