How can I center a table by its Border

I was working on my Item Codex for my MMO RPG Game... and I finished setting up the data loader that sets up the table with my item data in it.

Everything looks fine, except that the table that I instantiate my item information into is centered.

Because its dynamic, its centered is based on the length of the text/data in the cells, which leads to this ugly effect in the image below.

I am trying to find a way to center the table via the border that connects both sides as seen in the image, the red border is where it SHOULD be positioned, but is not.

What is the best way I can achieve this effect?

Find the live URL version here.

Solution

The Simplest Way to solve this is to set the td to 50%

td {
  width: 50%; 
}