есть некий код который генерит таблицу в строку и потом вставляет ее
следующим образом:
self.$(div.tableView).html = genPrefTrade();
при этом если первый ряд в таблице содержит ячейку с colspan (у меня colspan = 5)
получается вот что :
а если последний, то все ок:
CSS^
table.trade
{
background-color:#9CB3C9;
border: 1px solid black;
width:*;
height:*;
flow: table-fixed;
}
table.trade td
{
border: 1px solid black;
}
Здравствуйте, kuzbas22, Вы писали:
K>при этом если первый ряд в таблице содержит ячейку с colspan (у меня colspan = 5)
K>получается вот что :
K>
Тестирую так:
<html>
<head>
<style></style>
<script type="text/tiscript">
function self.ready()
{
/*$(div#envelope).$content(
<table border=1>
<tr><td colspan=2>12</td></tr>
<tr><td>1</td><td>2</td></tr></table>
);*/
$(div#envelope).html =
"<table border=1>"
"<tr><td colspan=5>12345</td></tr>"
"<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr></table>";
}
</script>
</head>
<body>
<div #envelope />
</body>
</html>
Проблемы не вижу. Проверяй у себя.
Здравствуйте, c-smile, Вы писали:
CS>Проблемы не вижу. Проверяй у себя.
Вот :
<html>
<head>
<style>
table.trade
{
background-color:#9CB3C9;
border: 1px solid black;
width:*;
height:*;
flow: table-fixed;
}
table.trade td
{
border: 1px solid black;
}
</style>
</head>
<body>
<table class = trade cols = 5 cellpadding = 0 cellspacing = 4 border = 0 >
<tr>
<td colspan = 5> <button id = T_3 class = tradebk> ПАС </button></td>
</tr>
<tr>
<td> <button id = T_4 class = tradespides> 6 </button> </td>
<td> <button id = T_5 class = tradeclubs> 6 </button> </td>
<td> <button id = T_6 class = tradediamonds> 6 </button> </td>
<td> <button id = T_7 class = tradehearts> 6 </button> </td>
<td> <button id = T_8 class = tradebk> 6 БК </button> </td>
</tr>
<tr>
<td> <button id = T_9 class = tradespides> 7 </button> </td>
<td> <button id = T_10 class = tradeclubs> 7 </button> </td>
<td> <button id = T_11 class = tradediamonds> 7 </button> </td>
<td> <button id = T_12 class = tradehearts> 7 </button> </td>
<td> <button id = T_13 class = tradebk> 7 БК </button> </td>
</tr>
<tr>
<td> <button id = T_14 class = tradespides> 8 </button> </td>
<td> <button id = T_15 class = tradeclubs> 8 </button> </td>
<td> <button id = T_16 class = tradediamonds> 8 </button> </td>
<td> <button id = T_17 class = tradehearts> 8 </button> </td>
<td> <button id = T_18 class = tradebk> 8 БК </button> </td>
</tr>
<tr>
<td> <button id = T_20 class = tradespides> 9 </button> </td>
<td> <button id = T_21 class = tradeclubs> 9 </button> </td>
<td> <button id = T_22 class = tradediamonds> 9 </button> </td>
<td> <button id = T_23 class = tradehearts> 9 </button> </td>
<td> <button id = T_24 class = tradebk> 9 БК </button> </td>
</tr>
<tr>
<td> <button id = T_25 class = tradespides> 10 </button> </td>
<td> <button id = T_26 class = tradeclubs> 10 </button> </td>
<td> <button id = T_27 class = tradediamonds> 10 </button> </td>
<td> <button id = T_28 class = tradehearts> 10 </button> </td>
<td> <button id = T_29 class = tradebk> 10 БК </button> </td>
</tr>
<tr>
<td colspan = 5> <button id = T_19 class = tradebk> МИЗЕР </button></td>
</tr>
</table>
</body>
</html>
Здравствуйте, c-smile, Вы писали:
CS>Смысл fixedlayout (flow:table-fixed) состоит в том что вычисление ширин столбцов осуществляется не
CS>по всему массиву ячеек (что есть O(n) операция) а по первым rows (что есть O(1) complexity).
CS>Это работает хорошо для случаев grid когда первый row есть column headers.
CS>В твоем случае либо убирать flow:table-fixed (не ясно вообще зачем оно тебе там нужно без headers)
CS>или в саму таблицу добавить fixedrows=2 чтобы алгоритм использовал как минимум один полный row.
fixedrows — помогло, спасибо!
flow:table-fixed использую потому что иначе верстка "едет"
вот взгляните на css, таблица вставляется в tableView.
И tableView увеличивает горизонтальный размер, хотя не должен (т.е. места хватает и справа получается пустота) в итоге mainView тоже увеличивается по горизонтали
Если поставить в таблице flow:table-fixed, то все ок.
div.mainView
{
flow:grid;
width:*;
height:*;
border-spacing:4px;
margin:10px;
}
div.leftPlayer
{
top:1#;
left:1#;
width:234px;
height:*;
border:1px solid #fff;
}
div.tableView
{
top:1#;
left:2#;
width:*;
height:*;
flow:horizontal;
border:1px solid white;
}
div.rightPlayer
{
top:1#;
left:3#;
width:234px;
height:*;
border:1px solid blue;
}
div.myPlayer
{
top:2#;
left:1#;
right:3#;
width:*;
height:210px;
border:1px solid red;
}