Как исправить ширину таблицы таблицы html после скрытия других cols?

Question

У меня есть таблица html, имеющая 5 столбцов. Во время разработки я использую, чтобы указать ширину каждого столбца с относительной шириной%. Во время выполнения коды javascript скрывают три столбца, другие два столбца становятся очень широкими. Как я могу оставить ширину оставшихся двух столбцов не измененной? Но я не хочу использовать pix для исправления ширины.

спасибо.

Answer 1

Я нашел лучший способ использует поплавок: левый.

td { 
    float:left; 
} 

<table> 
    <tr> 
    <td>Some text hidden</td> 
    <td>Some text hidden</td> 
    <td>Some text visibile</td> 
    <td>Some text hidden</td> 
    <td>Some text visibile</td> 
    </tr> 
</table> 

Answer 2

старайтесь использовать максимальную ширину 20% для каждого TD или TH в css.

Answer 3

Вы можете попробовать изменить способ скрытия этих столбцов: если они установлены на display:none; (либо с встроенным стилем, установленным js, либо путем добавления/удаления класса), вы можете изменить его на visibility:hidden; - таким образом они по-прежнему занимают место, но не будут показаны.

Answer 4

Если вы используете ширину окна просмотра vw вместо процентов %, это сработает.

table { 
 
    border-collapse: collapse; 
 
} 
 
td { 
 
    border: 1px solid; 
 
    width: 20vw; 
 
} 
 

 

 
td:nth-child(1), 
 
td:nth-child(2), 
 
td:nth-child(4) { 
 
    display: none; 
 
}

<table> 
 
    <tr> 
 
    <td>Some text hidden</td> 
 
    <td>Some text hidden</td> 
 
    <td>Some text visibile</td> 
 
    <td>Some text hidden</td> 
 
    <td>Some text visibile</td> 
 
    </tr> 
 
</table>