Sunny88
Sunny88

Reputation: 2940

Why does this html table get extra cells?

I don't have much experience with html, but I tried to make a simple table and I get extra cells in it, I don't know why. Here is the code:

<table border="1">
    <tr>
        <td colspan="5"> hi <td>
        <td colspan="3"> hi <td>
    </tr>
    <tr>
        <td colspan="3"> hi <td>
        <td colspan="5"> hi <td>
    </tr>
</table>

I expect this to have two rows with 2 cells in each, in first row first cell is bigger, and in second row second cell is bigger. But for some reason I get 4 cells in each row, like this:

.

Upvotes: 2

Views: 2905

Answers (4)

Boris
Boris

Reputation: 749

Missing closing tags for <td>.

<table border="1"> 
    <tr> 
        <td colspan="5"> hi </td> 
        <td colspan="3"> hi </td> 
    </tr> 
    <tr> 
        <td colspan="3"> hi </td> 
        <td colspan="5"> hi </td> 
    </tr> 
</table> 

Upvotes: 0

Jason
Jason

Reputation: 11615

You didn't terminate your <td>.... You need a </td> at the end.

Working Fiddle

http://jsfiddle.net/GFdP6/3/

<table border="1">
    <tr>
        <td colspan="5"> hi </td>
        <td colspan="3"> hi </td>
    </tr>
    <tr>
        <td colspan="3"> hi </td>
        <td colspan="5"> hi </td>
    </tr>
</table>

Furthermore

If you want it to look like you'd expect, you will have to set some widths on your td's like I did in the fiddle.

Upvotes: 6

Quentin
Quentin

Reputation: 944075

You have used TD Start Tags when you want TD End Tags. So you have 4 TD elements in each row instead of 2. (Note that the end tag for TD is optional so this is valid).

Upvotes: 1

Patrice Calv&#233;
Patrice Calv&#233;

Reputation: 694

It's a typo... The closing TD tags are missing.

<table border="1"> 
    <tr> 
        <td colspan="5"> hi --> close your tags here --> </td>
        <td colspan="3"> hi </td> 
    </tr> 
    <tr> 
        <td colspan="3"> hi </td> 
        <td colspan="5"> hi </td> 
    </tr> 
</table> 

Upvotes: 0

Related Questions