Merge two HTML table cells

HtmlHtml Table

Html Problem Overview

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?

Html Solutions

Solution 1 - Html

Set the colspan attribute to 2.

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

Solution 2 - Html

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

Solution 3 - Html

Use colspan for do this:

 <td colspan="3">PUR mix up column</td>
Categories
Recommended Html Solutions
Recommended Html Table Solutions

Previous Solution:

How to deselect all selected rows in a DataGridView control?

.NetWinformsDatagridview

Next Solution:

IntelliJ IDEA shortcut keymap for matching brace

Intellij IdeaShortcut

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionesqewView Question on Stackoverflow
Solution 1 - HtmlicktoofayView Answer on Stackoverflow
Solution 2 - HtmlMudassirView Answer on Stackoverflow
Solution 3 - HtmlSmokeView Answer on Stackoverflow