How do I remove the double border on this table?

Question

I am working on the HTML and CSS and I get this result which is not perfect:

Answer 1

Add the border-collapse:collapse; to the table css selector. This will eliminate that nested border look. Also, your Text:align:center; should really be text-align:center;

Fiddle: http://jsfiddle.net/GParb/1/

CSS

table{
    width:100%;
    border-collapse:collapse;
    text-align:center;
    border:1px solid #00F;
    font-size:12px;
    }

Unlike the cellspacing="0" as suggested below, this answer will collapse the borders to not be a 3D effect, just like what the OP asked for.

Comparison fiddle: http://jsfiddle.net/GParb/7/