CODEWITHSUNDEEP
htmlcss
joseagaleanoc
joseagaleanoc

Reputation: 615

How to remove all borders in table?

Heres my code:

<table border="0">
    <tbody>
        <tr style="border: none;">
            <td colspan="12" align="center">2012</td>
            <td colspan="12" align="center">2013</td>
        </tr>
        <tr>
            <td align="center" style="width: 31px;border: none;">Ene</td>
            <td align="center" style="width: 29px;border: none;">Feb</td>
            <td align="center" style="width: 31px">Mar</td>
            <td align="center" style="width: 30px">Abr</td>
            <td align="center" style="width: 31px">May</td>
            <td align="center" style="width: 30px">Jun</td>
            <td align="center" style="width: 31px">Jul</td>
            <td align="center" style="width: 31px">Ago</td>
            <td align="center" style="width: 30px">Sep</td>
            <td align="center" style="width: 31px">Oct</td>
            <td align="center" style="width: 30px">Nov</td>
            <td align="center" style="width: 31px">Dic</td>
            <td align="center" style="width: 31px">Ene</td>
            <td align="center" style="width: 28px">Feb</td>
            <td align="center" style="width: 31px">Mar</td>
            <td align="center" style="width: 30px">Abr</td>
            <td align="center" style="width: 31px">May</td>
            <td align="center" style="width: 30px">Jun</td>
            <td align="center" style="width: 31px">Jul</td>
            <td align="center" style="width: 31px">Ago</td>
            <td align="center" style="width: 30px">Sep</td>
            <td align="center" style="width: 31px">Oct</td>
            <td align="center" style="width: 30px">Nov</td>
            <td align="center" style="width: 31px">Dic</td>
        </tr>
        <tr>
            <td style="background-color: #000;border: none;">&nbsp;</td>
            <td style="background-color: #000;border: none;">&nbsp;</td>
        </tr>
    </tbody>
</table>

http://jsfiddle.net/GWj3w/2/

As you can see I set the border in the table to 0 and also the style for the tr and td tags to border: none but I still get that white line between cells, also in the style I put 

* {
    border: none;
    padding: 0;
    margin: 0;
}

How can I remove this border??

Thanks!!

Upvotes: 0

Views: 879

Answers (2)

Adrift
Adrift

Reputation: 59769

You can remove the spaces by using either (note: there is a slight difference between the two)

border-spacing: 0; or border-collapse: collapse; on the table.

Example: http://jsfiddle.net/GWj3w/1/

Upvotes: 3

klewis
klewis

Reputation: 8340

Easy fix! set cellpadding and cellspacing to 0 on your table element. All that border adjustments can be confusing, plus you don't need to control <tr> border adjustments. keep it simple :)

Upvotes: 1

Related Questions