Я использую таблицу HTML для календаря и хочу заполнить ячейки различными событиями из моей базы данных. Обычно они приземляются в выходные дни, но некоторые из них работают на длинные выходные, праздничные дни или даже на выходной.
Как заставить столбцы таблиц расширяться и уменьшаться соответственно. Я хотел бы избежать использования JavaScript, если это возможно.
Если этого не сделать, мне понадобится учебник, который поможет мне разобраться, как заставить позиционирование div вести себя.
ура
Изменить некоторые пояснения:
Изобразите это как 5 колонок,
col 1-3,5 = 30px
col 4 = 250px
Но я не всегда могу знать, прежде чем php нарисует таблицу, какой ширины они должны быть. потому что события могут быть в любой день (столбец).
Окончательное редактирование:
Похоже, я слишком старался с моим CSS. http://www.freeimagehosting.net/uploads/c900b5c77b.png
Я получил результат, которым доволен, следуя приведенному ниже предложению, удалив мои объявления ширины и изменив ячейки на max-width. Скорее всего, будет весело сделать это совместимым позже: (
Это Css, с которым я пошел. td.calendar-day-np - дни, исключенные из начала / конца этого месяца.
/* calendar */
table.calendar{width:100%;border-left:1px solid #999;}
tr.calendar-row{}
td.calendar-day{min-height:80px;position:relative;}* html div.calendar-day{height:80px;}
td.calendar-day:hover{background:#F9F9FA;}
td.calendar-day-np{background:#F9F9FA;min-height:80px;}* html div.calendar-day-np{height:80px;}
td.calendar-day-head{text-align:center;padding:5px;font-weight:bold;background:#ccc;border-bottom:1px solid #999;border-top:1px solid #999;border-right:1px solid #999;}
div.day-number{background:#ccc;padding:5px;color:#fff;font-weight:bold;float:right;margin:-5px -5px 0 0;width:20px;text-align:center;}
/* shared */
td.calendar-day,td.calendar-day-np{max-width:200px;padding:5px;border-bottom:1px solid #999;border-right:1px solid #999;}