表格HTML验证问题-元素th中没有任何单元格

Question

Cannot figure out how to lose these 2 errors I get in HTML5 validator:

Line 11, Column 151: Table columns in range 2…3 established by element th have no cells beginning in them . …t-weight:normal;padding:25px 5px 0 25px;overflow:hidden;word-break:normal;">

Error Line 11, Column 151: Table column 5 established by element th has no cells beginning in it . …t-weight:normal;padding:25px 5px 0 25px;overflow:hidden;word-break:normal;">

Any ideas?

SOURCE:

<table style="line-height: 21.9px; font-size: 14.6px; font-family: arial, helvetica, sans-serif; border-collapse:collapse;border-spacing:0; width:100%; max-width: 550px; background: #fff; margin: 15px auto;box-shadow:0px 0px 25px 1px rgba(19, 44, 54, 0.4);">
  <tr>
    <th colspan="5" style="font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:25px 5px 0 25px;overflow:hidden;word-break:normal;">   
            <img src="http://location.com/header.jpg" width="500" height="220" alt="päis" style="border:0;">
    </th>
  </tr>
  <tr>
    <td colspan="5" style="font-family:Arial, sans-serif;font-size:14px;padding:8px 25px;word-break:normal;vertical-align: top;"><p style="padding:0 5px; margin: 0; color: #354347;"><strong>Lorem ipsum.</strong><br /> 
    Lorem ipsum</p>
    </td>
  </tr>
  <tr>
    <td colspan="3" rowspan="3" style="font-family:Arial, sans-serif;font-size:14px;padding:8px 25px;word-break:normal;vertical-align: top;"><img src="http://location.com/foto-vasak.jpg" width="226" height="160" alt="vasak" style="border:0;"></td>
    <td colspan="2" style="font-family:Arial, sans-serif;font-size:14px;padding: 5px 5px !important;word-break:normal;vertical-align: top;"><p style="padding:0 5px; margin: 0; color: #354347;">Lorem ipsum</p>
    </td>
  </tr>
  <tr>
    <td colspan="2" style="font-family:Arial, sans-serif;font-size:14px;padding:8px 25px;word-break:normal;vertical-align: top; padding: 5px 5px !important;"><img src="http://location.com/kandideeri.png" alt="kandideeri" width="287" height="57" style="display:block; margin-left: -40px; border:0;">
    </td>
  </tr>
  <tr>
    <td colspan="2" style="font-family:Arial, sans-serif;font-size:14px;padding:8px 25px;word-break:normal;vertical-align: top; padding: 5px 5px !important;"><p style="padding:0 5px; margin: 0; color: #354347;">Lorem ipsum <a href="http://location.com/" target="_blank">Lorem ipsum</a>
või <a href="http://location.com/" target="_blank">Lorem ipsum</a></p>
    </td>
  </tr>
  <tr>
    <th colspan="5" style="text-align:left; font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding: 10px 5px 0 25px !important; overflow:hidden;word-break:normal;"><a href="http://location.com/" target="_blank">
      <img src="http://location.com/logo.jpg" width="215" height="49" alt="logo" style="border:0;"></a><br /><br />
    </th> 
  </tr>

</table>

Answer 1

There is a hack. Do this for the table's first row

  <tr style="display:none">
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
  </tr>

This will tell the browser there are five columns. It will validate.