table in html?

Question

css

4 and 5 are the rows of the table,
1, 2, 3 are the columns,
Is it possible to arrange the 3rd column as in the picture? (for the entire width of the row under the rest)

Answer 1

I don't know if there is a nice way. Why is this option unsatisfactory? codepen.io/anon/pen/ZbrxKN

Answer 2

The flow of the document is broken, so in addition to CSS, JavaScript comes in handy here.

Answer 3

You can, open the WISYWING editor in 5 minutes, you will draw such

Answer 4

It turns out in the fourth line another table of 2 rows and 3 columns,
something like this:

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
  <tbody>
    <tr>
      <td colspan="3">&nbsp;</td>
    </tr>
    <tr>
      <td colspan="3">
      <table border="1" cellpadding="1" cellspacing="1" style="width:500px">
        <tbody>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td colspan="3">&nbsp;</td>
          </tr>
        </tbody>
      </table>
      </td>
    </tr>
    <tr>
      <td colspan="3">&nbsp;</td>
    </tr>
  </tbody>
</table>

Answer 5

codepen.io/Screpka/pen/XmZEEJ or so, crooked, but there is simply no time for "beautiful".

Answer 6

use colspan