![[The University of Leicester]](unilogo.gif)
Merging Cells in Plone Table
plone
I first discovered how to do this when making the Airport location map within the Interntaional Section of the the Welfare site
|
Row 1, Column 1 |
Row 1 Column 2 Cell Merged Accross Three Rows. Pictures can now cross Several Rows |
Row 1, Column 3 |
|---|---|---|
| Row 2, Column 1 | Row 2, Column 3 | |
| Row 3, Column 1 | Row 3, Column 3 |
This is done in the HTML code using this code:
<table class="plain">
<tbody>
<tr>
<th class="orange"> </th>
<td class="blue" rowspan="3"></td>
<th class="yellowglossy">Row 1, Column 3</th>
</tr>
<tr>
<th class="greenglossy"> </th>
<th class="greyshadow"> </th>
</tr>
<tr>
<th class="purpleglossy"> </th>
<th class="purpleglossy"> </th>
</tr>
</tbody>
</table>
The key is the rowspan="3" is the second column. However cells in the same column have to be removed from the rows below.
Another test table:
| Top two Cells of the column mergeds | no cells merged | All the cells in the column merged | |
|---|---|---|---|
| bottom Two Cells of the Column mergerd | |||
Column Merging:
| Column 1 and 2: 1 Cell merged over 2 Columns | Column 3 | Column 4 | |
|---|---|---|---|
| Column 1 | Column 2 | Column 3 | Column 4 |
| Column 1,2,3 and 4: 1 Cell Meged over 4 Columns | |||
HTML code for Row 1:
<tr>
<th class="blueglossy" colspan="2"> </th>
<th class="purpleglossy"> </th>
<th class="greyglossy"> </th>
</tr>
colspan="2" enable two cells in a row to be merged, the second cell needs to be removed from the HTML.
