Указание процентной ширины для ячеек таблицы CSS

Я пытаюсь создать календарь недели на основе HTML/CSS, используя дисплей CSS: стиль таблицы-ячейки на divs, соответствующий каждому дню. Когда я укажу процентную ширину для дневных divs, которая больше 17%, divs заполняет весь экран, как ожидалось (с 7 * 17% > 100%).

jsfiddle здесь: http://jsfiddle.net/huDxZ/1/

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

jsfiddle здесь: http://jsfiddle.net/DLjnH/

Я бы хотел, чтобы мои дневные divs имели ширину около 14%, поэтому они грубо заполняют ширину страницы и имеют равные размеры. К сожалению, ширина 14% выглядит еще хуже.

jsfiddle здесь: http://jsfiddle.net/YB5bY/

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

Пожалуйста, никаких решений, связанных с поплавками.

Спасибо!

Ответы

#calendar {
    display: table;
    height:900px;
    width: 100%;
}

#calendar {
    display: table;
    height:900px;
    width: 100%;
}