Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialElizabeth Chipendo
Courses Plus Student 6,468 Pointshow to add a colspan attribute to the table cell inside the table footer so that it spans the width of the table
how to add a colspan attribute to the table cell inside the table footer so that it spans the width of the table
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML Tables</title>
</head>
<body>
<table>
<thead>
<tr>
<th scope="col">Name</th>
<th scope="col">Job</th>
</tr>
</thead>
<tbody>
<tr>
<td>Nick</td>
<td>Designer</td>
</tr>
<tr>
<td>Andrew</td>
<td>Developer</td>
</tr>
<tr>
<td>Dave</td>
<td>Developer</td>
</tr>
<tfoot>
<tr>
<td>data is updatedv everyb 15 minutes</td>
</tr>
<tr>
<td>colspan="width:100%"</td>
</tr>
</tfoot>
</tbody>
</table>
<tfoot></tfoot>
</body>
</html>
7 Answers
Chris Shaw
26,676 PointsHi Elizabeth,
You have slightly too much markup meaning the second td
element in your tfoot
isn't required as the colspan
attribute allows us to span a single td
over multiple columns rather than needing extra and redundant td
elements.
The colspan
attribute only accepts values that are integers starting from 0 so in this case we need to span two columns therefore the value required is 2, see the below.
<tfoot>
<tr>
<td colspan="2">Data is updated every 15 minutes.</td>
</tr>
</tfoot>
Happy coding!
Ary de Oliveira
28,298 Points<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>HTML Tables</title> </head> <body>
<table>
<caption>Employee Information</caption>
<thead>
<tr>
<th scope="col">Name</th>
<th scope="col">Job</th>
</tr>
Elizabeth Chipendo
Courses Plus Student 6,468 Pointsthank you Chris, this was giving me problems but i succeeded after following your advice
Chris Shaw
26,676 PointsYou're welcome.
Elizabeth Chipendo
Courses Plus Student 6,468 Pointshow thwen do i add a cation element that says 'employee data'.
Chris Shaw
26,676 PointsNick explains how to do this in the video.
https://teamtreehouse.com/library/html-tables/structuring-tables/the-caption-element
Elizabeth Chipendo
Courses Plus Student 6,468 Pointsthank you then
monica shoriwa
5,260 Points<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>HTML Tables</title> </head> <body>
<table>
<caption>Employee Information</caption>
<thead>
<tr>
<th scope="col">Name</th>
<th scope="col">Job</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="2">Data is updated every 15 minutes.</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Nick</td>
<td>Designer</td>
</tr>
<tr>
<td>Andrew</td>
<td>Developer</td>
</tr>
<tr>
<td>Dave</td>
<td>Developer</td>
</tr>
</tbody>
</table>
</body> </html>
Ary de Oliveira
28,298 Points<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>HTML Tables</title> </head> <body>
<table>
<caption>Employee Information</caption>
<thead>
<tr>
<th scope="col">Name</th>
<th scope="col">Job</th>
</tr>