CODEWITHSUNDEEP
htmlhtml-table
esqew
esqew

Reputation: 44722

Merge two HTML table cells

I'm creating a table in HTML and I'd like to have my top cell be the width of two. Here's a rough drawing:

__________________________________________
|                HEADER                  |
|                                        |
==========================================
|                  ||                    |
|     CONTENT      ||       CONTENT      |
|                  ||                    |
------------------------------------------

Is there a way to accomplish this in HTML?

Upvotes: 68

Views: 226096

Answers (3)

WhiteHawk
WhiteHawk

Reputation: 89

Use colspan for do this:

 <td colspan="3">PUR mix up column</td>

Upvotes: 3

Mudassir
Mudassir

Reputation: 13194

Add an attribute colspan (abbriviation for 'column span') in your top cell (<td>) and set its value to 2. Your table should resembles the following;

<table>
    <tr>
        <td colspan = "2">
            <!-- Merged Columns -->
        </td>
    </tr>

    <tr>
        <td>
            <!-- Column 1 -->
        </td>

        <td>
            <!-- Column 2 -->
        </td>
    </tr>
</table>

See also
     W3 official docs on HTML Tables

Upvotes: 110

icktoofay
icktoofay

Reputation: 129139

Set the colspan attribute to 2.

...but please don't use tables for layout.

Upvotes: 120

Related Questions