Атрибут переполнения на <td>не создает полосу прокрутки

Question

Я пытаюсь создать ячейку таблицы <td> с переполнением, но она не работает ...

Вот мой код CSS:

td.blog_content
{
    max-height: 50px;
    overflow: auto;
    width: 360px;
    text-align: left;
    padding: 2px;
}

И мой HTML:

<td class="blog_content"><?php echo $blog['content']; ?></td>

Было бы создать простое поле с полосой прокрутки, если текст слишком длинный ...

Answer 1

Попробуйте обернуть его в <div>.Я почти уверен, что атрибут переполнения не определен для элемента <td>, по крайней мере, в HTML4 это не так.

<td class="blog_content">
    <div><?php echo $blog['content']; ?></div>
</td>

.blog_content div {
    height: 50px;
    max-height: 50px;
    overflow: auto;
}

Answer 2

Похоже, вы должны обернуть содержимое в div:

<td class="blog_content"><div><?php echo $blog['content']; ?></div></td>

td.blog_content div
{
    max-height: 50px;
    overflow: auto;
    width: 360px;
    text-align: left;
    padding: 2px;
}

Демо: http://dabblet.com/gist/1747301

Answer 3

Установите table-layout: fixed; на table, содержащем ваши клетки.Или же оберните содержимое каждой ячейки в div и примените к нему стили.

Answer 4

Можно поставить:

<td class="blog_content">
  <div style="overflow:auto;width:200px;">
      <?php echo $blog['content']; ?>
  </div>
</td>

Добавление элемента DIV будет иметь фиксированную высоту или ширину и свойство переполнения для auto заставит его прокручиваться.

Answer 5

Я не уверен, что вы можете принудительно прокрутить полосу прокрутки на overflow: auto в ячейке таблицы, но вы точно можете сделать это с div -tag.Рассматривали ли вы использовать div?