Ширина атрибута таблицы игнорируется - PullRequest
Новая
       6

Ширина атрибута таблицы игнорируется

7 голосов
/ 22 июля 2010

Моя цель - создать html-файл с таблицами и экспортировать их в pdf.
К сожалению, я не могу заставить стол вести себя так, как я хочу.

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

Только s для дней имеют ширину, заданную с помощью CSS (style="width:...").

Проблема в том, что ширина полностью игнорируется, поэтому поля с днями от 1 до 9 имеют вдвое меньшую ширину, чем остальные. И, как следствие, поскольку поля выше размера автоматически, поскольку они не имеют заданной ширины, их размер также неверен.

альтернативный текст http://img217.imageshack.us/img217/6617/scale1x.jpg

Вот источник, который генерируется: http://pastebin.com/JyiqhSzs

То, что мы пробовали до сих пор:

  • используется не CSS (width="")
  • дать другому полю также вычисленную ширину (значение colspan, умноженное на ширину дня)

Также установите style="table-layout:fixed;" для таблицы, но это не имеет никакого эффекта.

Значит, я не знаю, как получить таблицу желаемой ширины?

Ответы [ 4 ]

15 голосов
/ 22 июля 2010

Вместо width: 23px используйте min-width: 23px.Это работало для IE8 и FireFox.Я еще не нашел волшебную формулу для IE7, чтобы не сужать однозначные дни (работая над этим).Я знаю, что table-layout: fixed не нужен, и наверняка вызовет проблемы с любым дисплеем IE7, который может работать.

Кроме того, если вы всегда хотите, чтобы они были одинакового размера, вы можете рассмотреть возможность использования em, чтобы при изменении размера текста ваша таблица пропорционально увеличивалась / уменьшалась.Я не знаю всех ваших потребностей, но просто предложение изучить.

Редактировать: Более кросс-браузерное решение. IE6 и 7 должны иметь все цифры в «днях»ячейки, обернутые div, а затем вместо стилизации td с любым типом ширины стиль div с width: 23px не min-width: 23px.

3 голосов
/ 22 июля 2010

Неужели атрибут style также неправильно напечатан как stlye на вашей реальной странице?

Еще несколько подсказок:

  • Обычно ячейка таблицы сжимается, если таблицане помещается на всю страницу, вот как работают HTML-таблицы.
  • Попробуйте table-layout: fixed после исправления опечатки.
  • Если это все еще не работает, вам нужно добавитьdiv (или некоторый другой элемент) для каждой ячейки и укажите вместо нее ширину
  • Ширина в пикселях не будет работать, если шрифт не соответствует ожидаемому размеру (и нет, вы не можетезаставить его до определенного размера).Попробуйте 2ex.
  • Вместо установки стиля в каждом и каждом td, почему бы вам не установить в таблице стилей.

Пример: 

<tr class="days"><td>1</td><td>2</td></tr>

tr.days td {
  width: 23px;
}
2 голосов
/ 22 июля 2010

Вы не можете просто указать "width = ...", вы должны изменить способ отображения элемента CSS ...

Итак, давайте предположим, что мы хотим, чтобы ячейка имела ширину 30 пикселей: 

style="width: 30px !important; display: block;"

дисплей: блок;в основном говорит CSS, что он должен изменить размер элемента на основе размеров, заданных в width: и height: и не основываясь на том, что на самом деле находится в элементе.элемента может простираться за пределы, заданные шириной и высотой, но в такой ситуации я не думаю, что это будет большой проблемой.

HTH

0 голосов
/ 16 марта 2013

Я решил ту же проблему в аналогичном случае, установив ширину на уровне <td> немного больше ожидаемого текста, например: 

<td style="width:50em">
...