rcsole rcsole - 1 month ago 5
HTML Question

HTML tables and rowspan and colspan behavior

I'm working on this assignment and pretty much everything works fine, but I can't understand why the top cell does not occupy the entire space.

Also, it'd be really useful to know if I can format cells (size and such).

Here's the code.

<html>
<head>
</head>
<body>
<table border="1">
<tr>
<th colspan="4">Notas de HTML</th>
<tr>
<td colspan="2">Alumno</td>
<td colspan="2">Conceptos (60%)</td>
<td colspan="3">Procedimiento (30%)</td>
<td rowspan="2">Actitud (10%)</td>
</tr>
<tr>
<td>Apellidos</td>
<td>Nombre</td>
<td>Examen te&oacute;rico</td>
<td>Examen pr&aacute;ctico</td>
<td>Pr&aacute;ctica 1</td>
<td>Pr&aacute;ctica 2</td>
<td>Pr&aacute;ctica 3</td>
</tr>
<tr>
<td>ape1</td>
<td>nom1</td>
<td>7</td>
<td>6.5</td>
<td>8</td>
<td>4</td>
<td>9</td>
<td>9</td>
</tr>
<tr>
<td>ape2</td>
<td>nom2</td>
<td>5</td>
<td>4</td>
<td>6</td>
<td>4</td>
<td>5</td>
<td>7</td>
</tr>
</tr>
</table>
</body>



Answer

To span all eight columns you need to use this:

<th colspan="8">Notas de HTML</th>

jsFiddle example

And by using CSS you can format cells however you like.