Здравствуйте, как в ячейке таблицы разместить пример кода? <tr> <td><pre><div>Див</div></pre></td> так...

Question

Здравствуйте, как в ячейке таблицы разместить пример кода? <tr> <td><pre><div>Див</div></pre></td> так...

Рейтинг: 3 из 5, голосов 1

24 января 2022 г.

Здравствуйте, как в ячейке таблицы разместить пример кода? <tr> <td><pre><div>Див</div></pre></td> так пробовал тоже <tr> <td><code><div>Див</div></code></td> Все равно выдает просто Див и занимает остальное место пустым пространством за счёт того что тег div блочный

1

Accepted Answer

Добрый день. К сожалению, по вашему описанию мне не удалось понять к какому результату вы хотите прийти, поэтому дам обобщенный ответ.

Ширина ячеек таблицы, по умолчанию, регулируется контентом, содержащимся в них.

Если вы хотите ограничить ширину таблицы и/или конкретного столбца, вы можете воспользоваться CSS свойством width.

Что касается размещения примера кода, то обычно для форматирования такого блока используется либо тег <br /> (конец строки), либо для блока-контейнера примера кода определяются правила переноса с помощью CSS свойств word-break и white-space. Для тега <pre> они обычно определены по умолчанию.

Одним из возможных вариантов почему у вас может не получаться решить вопрос форматирования, это подключенные к вашей странице сторонние CSS стили, переопределяющие свойства таблиц и/или правил переноса. В этом случае вам нужно переопределить соответствующие CSS свойства.

Вот пример таблицы, попробуйте протестировать его в редакторе кода.

<table>
 <tbody>
  <tr>
   <td style="background-color: #f5f5f5;">
    <div><code>контент первой<br />ячейки</code></div>
   </td>
   <td style="background-color: #efefef;">
    <pre><code>
контент
второй
ячейки
    </code></pre>
   </td>
  </tr>
 </tbody>
</table>