如果表的第二列太长，则使其跨在第一列上

Question

所以基本上这是我当前的结果：

24 February   TITLE TITLE TITLE TITLE
              TITLE TITLE
              CONTENT CONTENT CONTENT

我想要这个：

24 February   TITLE TITLE TITLE TITLE
TITLE TITLE
              CONTENT CONTENT CONTENT

这是HTML：

<table>
  <tr>
    <td>11 February</td>
    <td>TITLE TITLE TITLE TITLE TITLE TITLE TITLE</td>
  </tr>
    <td></td>
    <td>CONTENT CONTENT CONTENT</td>
  </tr>
</table>

和CSS：

table {
  table-layout: fixed;
  width: 50%;
  border: solid;
}


td:nth-of-type(1) {
  width: 5em;
  vertical-align:top;
}

我不知道如何实现我想要的东西，即使使用HTML表是个好主意，所以我愿意接受任何建议！

Answer 1

这是吗？

.a {
  width:50%;
}

.aa {
  display:inline-block;
  width:120px;
}

.ab {
   display:inline;
   word-break:break-word;
}

.b {
  word-break:break-word;
  margin-left:125px;
}

<div class="a">
  <div class="aa">
  24 February 
  </div>
  <div class="ab">
    TITLE TITLE TITLE TITLE TITLE TITLE
  </div>
</div>
<div class="b">
  CONTENT CONTENT CONTENT
</div>