Очень простая html-таблица

Мне нужно сделать таблицу, как показано ниже:

введите здесь описание изображения

Вот мой код, по логике вроде все правильно написано, но если убрать лишнюю ячейку, то все ломается. в чем может быть ошибка?

<table border=1>
  <tr>
    <td>One</td>
    <td>Two</td>
    <td>Three</td>
  </tr>
  <tr>
    <td>Four</td>
    <td>Five</td>
    <td rowspan=2>Six</td>
  </tr>
  <tr>
    <td rowspan=2>Seven</td>
    <td rowspan=2>Eight</td>
    <td>Extra</td>
  </tr>
  <tr>
    <td>Nine</td>
  </tr>
</table>


person xom9ikk    schedule 04.10.2017    source источник
comment
@ Лиам, я думаю, что под вложением подразумевается показанное изображение .. может быть ..   -  person rmjoia    schedule 04.10.2017
comment
Да вопрос может быть очень легкий, но не могу разобраться... Как сделать такую ​​же таблицу как на картинке?   -  person xom9ikk    schedule 04.10.2017
comment
@Liam Я прекрасно понял спрашивающего из исходного поста. Они опубликовали свою цель и то, что пытались. Чего я не понимаю, так это почему вы удалили их фрагмент кода, который позволял людям быстро увидеть, что пытался сделать спрашивающий.   -  person Nathan Smith    schedule 04.10.2017
comment
@Liam: Хорошо, достаточно честно, но я приветствую вас и других за то, что вы помогли сделать это понятным. Не у всех английский язык является родным. Надеюсь, OP научится использовать Google Translate для написания своих сообщений в будущем. Всем удачи!   -  person shellter    schedule 04.10.2017


Ответы (1)


Вот вы - я только что добавил вторую строку текста в более высокие/объединенные ячейки, но она (только) работает без этой «дополнительной» ячейки:

table {
  border-collapse: collapse;
}
td {
  border: 1px solid #444;
}
<table>
  <tr>
    <td>One</td>
    <td>Two</td>
    <td>Three</td>
  </tr>
  <tr>
    <td>Four</td>
    <td>Five</td>
    <td rowspan=2>Six<br>X</td>
  </tr>
  <tr>
    <td rowspan=2>Seven<br>X</td>
    <td rowspan=2>Eight<br>X</td>
  </tr>
  <tr>
    <td>Nine</td>
  </tr>
</table>

person Johannes    schedule 04.10.2017