防止 <p> 在 <td> 垂直方向溢出

Question

table {
  width: 660;
  height: 800;
}
table h2 {
  padding: 2px;
  border: 0px;
  border-collapse: collapse;
  border-spacing: 0px;
}
tr {
  max-height: 200px;
}
td {
  border-right: #5c5857 dashed 1px;
  width: 230px;
  max-height: 200px;
}
p {
  padding: 2px;
  font-size: 10px;
}
#post-thumbnail {
  margin: auto 0;
  padding: 2px;
}

<table>
  <tr>
    <td>
      <span id='post-thumbnail'>
        <img src='https://lh5.googleusercontent.com/-sI6mm8ZKBss/VPBaKwgV_jI/AAAAAAAAAC0/AIC31jCods8/h120/noimg.png' /></img>
      </span>
      <h2>Blog post title</h2>
      <p>Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy
        Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey
        Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy
        Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey
        Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy
        Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy</p>

    </td>
    <td>
      <span id='post-thumbnail'>
        <img src='https://lh5.googleusercontent.com/-sI6mm8ZKBss/VPBaKwgV_jI/AAAAAAAAAC0/AIC31jCods8/h120/noimg.png' /></img>
      </span>
      <p>Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy</p>
    </td>
    <td>
      <span id='post-thumbnail'>
        <img src='https://lh5.googleusercontent.com/-sI6mm8ZKBss/VPBaKwgV_jI/AAAAAAAAAC0/AIC31jCods8/h120/noimg.png' /></img>
      </span>
      <p>Hey Hey Hey Hey Hey HEy Hey Hey Hey HEy Hey Hey Hey HEy</p>
    </td>
  </tr>
</table>

我想尽一切办法垂直修复溢出。我尝试了谷歌搜索和其他所有方法。我需要帮助来修复 td 中垂直发生的溢出。我正在尝试为 Blogger 创建博客 post 显示样式。我希望缩略图出现在顶部，然后是博客的片段 post。我想连续显示 3 个这样的 post 信息，但是当文本很多时，td 就会向下溢出。我尝试了很多修复，但每次文本要么在任何其他方向溢出，要么只显示一行。

Answer 1

td {
    overflow-x: hidden; 
    overflow-y: hidden;
}
p {
    max-height: 120px; 
}

Answer 2

也尝试在您的 p class 上设置 max-height: 250px。

防止 <p> 在 <td> 垂直方向溢出

Prevent overflow of <p> inside <td> vertically

html

css

overflow