Как сделать таблицу HTML такой же ширины, что и содержащий ее тег div? - PullRequest
20 голосов
/ 16 сентября 2008

У меня есть стол внутри div. Я хочу, чтобы таблица занимала всю ширину тега div.

В CSS я установил ширину таблицы на 100%. К сожалению, когда у div есть какое-то поле, таблица оказывается шире, чем у div, в котором она находится.

Мне нужно поддерживать IE6 и IE7 (так как это внутреннее приложение), хотя я, очевидно, хотел бы полностью кросс-браузерное решение, если это возможно!

Я использую следующий DOCTYPE ...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Редактировать : К сожалению, я не могу жестко закодировать ширину, так как я динамически генерирую HTML, и это включает в себя рекурсивное вложение элементов div внутри друг друга (с левым полем для каждого элемента div это создает хороший «вложенный» эффект).

Ответы [ 13 ]

0 голосов
/ 16 сентября 2008

попробуйте это:

div {
 padding: 0px;
}

table {
    width: 100%;
    margin: 0px;
}

установив отступ div в ноль, вы удалите пространство между границами div и его содержимым. установив ширину таблицы на 100%, а ее поле на ноль, вы удалите пространство между границами таблицы и ее контейнера.

0 голосов
/ 16 сентября 2008

Может быть, эта обширная статья о Internet Explorer и блочной модели CSS поможет?

0 голосов
/ 16 сентября 2008

Это большая проблема с тем, как CSS обрабатывает свойство width, и причина, по которой Microsoft сначала по-разному реализовала блочную модель. Microsoft проиграла, и теперь это либо ширина, либо поле / отступ / граница для элемента.

Ситуация может измениться в лучшую сторону в CSS3 с свойство размера блока

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...