HTML Table TD ROWSPAN не расширяется ⇐ CSS

[Anonymous]

Я создал CSS Class FixedTitle для таблиц с фиксированным первым рядом (Thead) и прокручиванием оставшихся рядов. К сожалению, Rowspan в таких таблицах не работает по какой -то причине. Вот примеры таблицы: < /p>

col 1col 2col 3
123
4 6
7 9
10 12
13 15
161718
192021
222324

< /code>
и соответствующий CSS: < /p>
table.fixedtitle {
font-family: sans-serif;
width: 100%;
max-height: 30px;
}
table.fixedtitle, table.fixedtitle td, table, table td {
border-collapse: collapse;
border: 1px solid #000;
}
table.fixedtitle thead, table.fixedtitle thead tr {
display: table; /* to take the same width as tr */
width: calc(100% - 17px); /* - 17px because of the scrollbar width */
background-color: rgb(112, 196, 105);
color: white;
font-weight: normal;
padding: 2px 4px;
text-align: center;
}
table.fixedtitle thead tr {
display: table; /* to take the same width as tr */
width: calc(100%);
}
table.fixedtitle tbody {
display: block; /* to enable vertical scrolling */
max-height: 600px; /* e.g. */
overflow-y: scroll; /* keeps the scrollbar even if it doesn't need it; display purpose */
}
table.fixedtitle th, table.fixedtitle td {
/* width: 3.33%; /* to enable "word-break: break-all" */
padding: 5px;
word-break: break-all; /* 4. */
border-top: 1px solid #000;
border-right: 1px solid #000;
}
table.fixedtitle tr {
display: table; /* display purpose; th's border */
width: 100%;
background-color: rgb(226, 238, 238);
color: rgb(111, 111, 111);
padding: 2px 4px;
box-sizing: border-box; /* because of the border (Chrome needs this line, but not FF) */
}
table.fixedtitle td {
text-align: center;
border-bottom: none;
border-left: none;
}

table thead, table thead tr {
background-color: rgb(112, 196, 105);
color: white;
font-weight: normal;
padding: 2px 4px;
}
table th, table td {
padding: 5px;
word-break: break-all; /* 4. */
border-top: 1px solid #000;
border-right: 1px solid #000;
}
table tr {
background-color: rgb(226, 238, 238);
color: rgb(111, 111, 111);
padding: 2px 4px;
box-sizing: border-box; /* because of the border (Chrome needs this line, but not FF) */
height: 20px; /*do not hide rows with contents from rowspaned columns above and below only */
width: 20px;
}
< /code>
Вот ссылка на jsfiddle: text. < /p>
Если я удалю класс из таблицы Rowspan расширяется, как и ожидалось. Что заставляет его прекратить расширяться и что я могу сделать, чтобы сохранить фиксированную функциональность заголовка, одновременно включающего Rowspan?

Подробнее здесь: https://stackoverflow.com/questions/797 ... not-expand