colspan="1.5" not working, any other ideas?-CodePudding

this is what table i need I can easily get first and second row good but when i'm trying to make row third, I'm destroying row two.

I tried with width attribute and colspan but nothing work.

<table border="1px" width="100%">
        <tr>
            <td colspan="6">Cell 1</td>
        </tr>
        <tr >
            <td colspan="3">Cell 2</td> 
            <td colspan="3" >Cell 3</td>
        </tr>
        <tr>
            <td colspan="2">Cell 4</td> 
            <td colspan="2">Cell 5</td>            
            <td colspan="2">Cell 6</td> 
        </tr>
    </table>

CodePudding user response：

A <table> will conform to it's content by default so there's no need for each column to be equal in width. So manually assign equal column widths by assigning table-layout: fixed to <table> then an equal width for each column by either assigning each width to the <th> in the <thead> of the first <tr> or lacking that assign widths to the <td> of the first <tr> (of course td or th as a selector works as well), see example below.

table {
  table-layout: fixed;
}

td {
  width: 16.5%;
  text-align: center;
}

<table border="1px" width="100%">
  <tr>
    <td colspan="6">I</td>
  </tr>
  <tr>
    <td colspan="3">II</td>
    <td colspan="3">III</td>
  </tr>
  <tr>
    <td colspan="2">IV</td>
    <td colspan="2">V</td>
    <td colspan="2">VI</td>
  </tr>
</table>