Please assess my Structuring planet data table :)

Greetings, amazing Mozilla contributors!

My table for structuring planet data looks just like the original, but I was wondering if there was room for improvement in the way my code is presented or if I could have designed the cells differently.

Here is my code:

I’d appreciate any feedback, thank you!

Hello @ElMoscaviador

you doing great well done just few notice here:

  1. you missed to use the tbody element

  2. for many of the colspan and rowspan you added extra 2 or 1 so for example

 <th colspan="4">&nbsp;</th>
and
<th rowspan="5" colspan="4">Terrestrial planets</th>
and there others 

should be

<th colspan="2">&nbsp;</th>

<th rowspan="4" colspan="2">Terrestrial planets</th>

i guess cause of point 3

  1. there extra tr element

 <tr>
            <th rowspan="5" colspan="4">Terrestrial planets</th>
        </tr>   // the issue here that you ended the first tr and create new one after it
        <tr>
            <th colspan="2">Mercury</th>
            <td>0.330</td>
            <td>4,879</td>
            <td>5427</td>
            <td>3.7</td>
            <td>4222.6</td>
            <td>57.9</td>
            <td>167</td>
            <td>0</td>
            <td>Closest to the Sun</td>
        </tr>

it should be

<tr>
            <th rowspan="4" colspan="2">Terrestrial planets</th>
        
        
            <th>Mercury</th>
            <td>0.330</td>
            <td>4,879</td>
            <td>5427</td>
            <td>3.7</td>
            <td>4222.6</td>
            <td>57.9</td>
            <td>167</td>
            <td>0</td>
            <td>Closest to the Sun</td>
        </tr>
  1. you missed the last point
    Add a black border just around the column that contains all the planet name row headers.

by the way it would be good to try to use an IDE or code editor like https://code.visualstudio.com/ or https://www.jetbrains.com/webstorm/
you can use the EAP version of webstorm for free :wink:

hope i did not miss anything else and hope that help and have a nice day :slight_smile:

1 Like