Removing border from table cells

css, html, html-table, xhtml

Solution

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.

Problem

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> ```

Original source