Blogger Ever

how to merge multiple columns in HTML table

Table,one of the most using HTML tool ,usually used in our posts,widgets etc.But,sometimes their is a need to merge the columns for headings and different purposes and I also faced that issue before that is  why now I'm going to tell you to make this possible with simple attributes.
This is a example of the HTML table

HTML

<table border="1px">
<tr>
<td>This is column 1</td>
<td>This is column 2</td>
</tr>
<tr>
<td>This is column 1</td>
<td>This is column 2</td>
</tr>
<tr>
<td>This is column 1</td>
<td>This is column 2</td>
</tr>
</table>

Result

This is column 1 This is column 2
This is column 1 This is column 2
This is column 1 This is column 2

Now lets move on to our issue.This is a simple attribute that merge the multiple columns.That is
colspan="n"
where n is the number of columns you want to merge.Here is an example.

HTML

<table border="1px">
<tr>
<td colspan="2">This column is now merged</td>
</tr>
<tr>
<td>This is column 1</td>
<td>This is column 2</td>
</tr>
<tr>
<td>This is column 1</td>
<td>This is column 2</td>
</tr>
</table>

Result 

This column is now merged
This is column 1 This is column 2
This is column 1 This is column 2

And you are done!
Blogger

2013-2016 Copyright Blogger E\ver . Coded, managed and founded by Mohammad Hamza (@hamzadhamiya) . Hosted on Blogger and fonts used are Raleway and Open Sans.