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 trial

HTML HTML Tables Structuring Tables Add the Table Footer Element

how 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

index.html
<!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
Chris Shaw
26,676 Points

Hi 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!

<!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>

thank you Chris, this was giving me problems but i succeeded after following your advice

Chris Shaw
Chris Shaw
26,676 Points

You're welcome.

how thwen do i add a cation element that says 'employee data'.

thank you then

<!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>

<!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>