Limit height of <td> element even if text in same table is longer [closed]

Question

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.

---

Want to improve this question? Update the question so it's on-topic for Stack Overflow.

Closed 7 years ago.

Improve this question

So this is what I have. http://www.welivetech.net/showthread.php?tid=62&pid=131#pid131

As you can see from most of the posts in the thread (the first three), the postbit (blue box with avatar inside) looks fine.

However, the fourth postbit is elongated vertically because of the longer post content.

How would one go about keeping the postbit size the same even if there is a massive amount of text? Trust me, I've tried EVERYTHING for about 2 hours now...

Answer 1

You needs to use DIV inside you avatar TD, and this DIV must be styled as your current blue TD. TD will play the role of transparent container

Let's explain. Now you have:

<tr>
  <td class="avatar"><!-- Avatar block here --></td>
  <td>Post text</td>
</tr>

You needs:

<tr>
  <td class="container">
    <div class="Avatar><!-- Avatar block here --></td>
  </td>
  <td>Post text</td>
</tr>

Answer 2

Have you tried overflow: scroll? Like:

.some_css_class {
  height: 100px; 
  overflow: scroll;
} 

In my example, if the content is higher than 100px, it will keep the height and make the element scrollable.