/TableOfPlanets

MDN HTML Project of learning tables

Primary LanguageHTMLMIT LicenseMIT

Table of Planets Project

MDN Structuring Tables

Project Brief

You are working at a school; currently your students are studying the planets of our solar system, and you want to provide them with an easy-to-follow set of data to look up facts and figures about the planets. An HTML data table would be ideal — you need to take the raw data you have available and turn it into a table, following the steps below.

Steps to complete

  • Open your copy of blank-template.html, and start the table off by giving it an outer container, a table header, and a table body. You don't need a table footer for this example.

  • Add the provided caption to your table.

  • Add a row to the table header containing all the column headers.

  • Create all the content rows inside the table body, remembering to make all the row headings into headings semantically.

  • Ensure all the content is placed into the right cells — in the raw data, each row of planet data is shown next to its associated planet.

  • Add attributes to make the row and column headers unambiguously associated with the rows, columns, or rowgroups that they act as headings for.

  • Add a black border just around the column that contains all the planet name row headers.