HTML Table Issue

[willroach]

Hello all,
can't seem to get this table to provide the proper results without displaying the error shown below when ran through a validator.


<div class="techDiv">

<p style="font-family: copperplate; color: lightblue; font-size: 30px;"><u> Technology Skills </u> </p>

<table>

<tr>

<th style="font-family: verdana; color: lightblue"> Skill</th>

<th style="font-family: verdana; color: lightblue">Confidence</th>

</tr>

<tr>

<td style="font-family: verdana; color: white">HTML & CSS</td>

<td style="font-family: verdana; color: white">8/10</td>

</tr>

<tr>

<td style="font-family: verdana; color: white">Python</td>

<td style="font-family: verdana; color: white">7/10</td>

</tr>

<tr>

<td style="font-family: verdana; color: white">Databases & SQL</td>

<td style="font-family: verdana; color: white">6/10</td>

</tr>

</table>

</div>

 

[BigDady]

You are using an experimental validator. I ran your code and found no problems (well, I had to change the color to black to see it).
So I went to the official site: https://validator.w3.org/#validate_by_input It said "No problems"

FYI: use CSS style instead of inline styling and it would be fewer words.

 

[VBService]

BTW, you can use more options that the table in html and css offer.

<div class="techDiv">
  <table>
    <caption>Technology Skills</caption>
    <thead>
      <tr>
        <th>Skill</th>
        <th>Confidence</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>HTML & CSS</td>
        <td>8/10</td>
      </tr>
      <tr>
        <td>Python</td>
        <td>7/10</td>
      </tr>
      <tr>
        <td>Databases & SQL</td>
        <td>6/10</td>
      </tr>
    </tbody>
  </table>
</div>

<style>
  table {
    color: black;
    text-align: center;
    font-size: .95rem;
  }
  caption {
    font-family: copperplate;
    font-size: 180%;
    color: lightblue;
    text-decoration: underline;
    padding: .5rem;
  }
  th,td {
    font-family: verdana;
  }
  th {
    color: lightblue;
  }
  tr:nth-child(even) {
    background-color: lightblue;
  }
</style>