Removing border from table cells

Question

I know this is a dumb question but I seem to have totally forgotten how to do it.

I have a HTML table and I want to remove all borders around all the cells so that there is only one border around the entire table.

My code looks like:

<table border='1' width='500'>   <tr><th><h1>Your Wheelbarrow</h1></th><tr>     <th>Product</th>     <th>Description</th>     <th>Price</th>     <th>Quantity</th>     <th>Total</th>     <th>Delete</th>   </tr> 

Answer 1

Just collapse the table borders and remove the borders from table cells (td elements).

table {     border: 1px solid #CCC;     border-collapse: collapse; }  td {     border: none; } 

Without explicitly setting border-collapse cross-browser removal of table cell borders is not guaranteed.