html - 我可以创建这样的 HTML 设计吗？

Question

我可以像这里的解决方案一样创建 HTML 设计吗:
HTML and CSS align divs between a line

但不使用位置属性。我正在使用表格，但无法设计内部 DIV。
请指教。

Answer 1

看看这个

table {
  width: 500px;
  background: #2A3F50;
  margin: 40px 0px;
}

table tr td {
  padding: 10px;
}

table tr td div {
  background: #1BBC9D;
  padding: 20px;
  margin-top: -30px;
  margin-bottom: -30px;
  color: white;
}

<table>
  <tr>
    <td>
      <div>
        <h3>Do you know?</h3>
        <p>Over the past 12 weeks, most product sales for <b>Combisunate 20/120 Tablets 2</b> was on <b>Weednesday Jul 12, 2017</b>b>
        </p>
        <p>
          On that day, most verification came between <b>9AM</b> and <b>10AM UTC</b>
        </p>
      </div>
    </td>
    <td><img src="http://icons.iconarchive.com/icons/zhoolego/material/512/Folder-Doc-icon.png" width="100px" /></td>
  </tr>
</table>