Почему tr, td не в полную ширину?

Ссылка скопирована
CSS HTML PHP
12 января 2026 1 ответ

Делаю верстку письма, но почему то когда ставлю br либо max-width для текста размер td и tr ограничивается
Вот таблица:

<table class="pc-hidden" style="border-collapse: collapse; overflow: hidden;"                                 cellpadding="0" cellspacing="0" width="100%" align="center" bgcolor="#B72025">                                 <tr width="100%">                                     <td colspan="1">                                         <h2 style="text-align: center !important;" class="header__title">AKTION                                             "LAGERRÄUMUNG" BIS<br>ZUM <span>14.08.2023</span>                                             VERLÄNGERT!                                         </h2>                                         <p style="text-align: center !important;" class="header__text">*25% Rabatt auf                                             Alle Artikel<br>                                             Inklusive *3% bei Vorkasse!<br>                                             *Ab Warenkorbwert von 2500€</p>                                     </td>                                 </tr>                                 <tr>                                     <td colspan="1" width="100%" height="200px" style="position: relative;">                                         <img src="#" alt="img" >                                     </td>                                 </tr>                             </table>

<table class="pc-hidden" style="border-collapse: collapse; overflow: hidden;" cellpadding="0" cellspacing="0" width="100%" align="center" bgcolor="#B72025"> <tr width="100%"> <td colspan="1"> <h2 style="text-align: center !important;" class="header__title">AKTION "LAGERRÄUMUNG" BIS<br>ZUM <span>14.08.2023</span> VERLÄNGERT! </h2> <p style="text-align: center !important;" class="header__text">*25% Rabatt auf Alle Artikel<br> Inklusive *3% bei Vorkasse!<br> *Ab Warenkorbwert von 2500€</p> </td> </tr> <tr> <td colspan="1" width="100%" height="200px" style="position: relative;"> <img src="#" alt="img" > </td> </tr> </table>

Дополнительно:

max-width не будет везде работать! И зачем вообще для него это значение.
Вот тут актуальный список что где поддерживается.
Я бы на вашем месте это место разделил на

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Мария Код Ответ

Проблема, описанная в вашем вопросе, может возникать из-за того, что по умолчанию элементы

и

в HTML таблицах не занимают всю доступную ширину контейнера. Для того чтобы элементы

и

занимали всю доступную ширину, необходимо применить некоторые CSS стили.

Для начала, убедитесь, что у таблицы установлено свойство width: 100%, чтобы она занимала всю доступную ширину. Затем, примените следующие стили к элементам

и

:

table {
  width: 100%;
  border-collapse: collapse;
}
 
td, th {
  width: 100%;
}

table { width: 100%; border-collapse: collapse; } td, th { width: 100%; }

Эти стили гарантируют, что каждая ячейка

и

займет всю доступную ширину таблицы. Также, убедитесь что у таблицы нет отступов (padding) и границ (border), которые могут влиять на ширину элементов.

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

и

.

Надеюсь, что эти советы помогут вам решить проблему с шириной элементов

и

в ваших HTML таблицах. Если у вас остались дополнительные вопросы, не стесняйтесь задавать их.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно

Веб-разработка Какие особенности разработки сайтов под тор/даркнет? 1 ответ Веб-разработка Как поправить этот код чтобы можно было обновить данные в бд( при взаимодействии с методом класса в Node.js)? 2 ответов Android Как заменить класс AuthorizationCodeInstalledApp на Android (Google API)? 1 ответ Google Как подтвердить аккаунт Google? 1 ответ