Question

我有一张包含大量记录和搜索框的表格

<table>
    <tr>
        <td class="col-3">name1</td>
        <td class="col-3">sName1</td>
        <td class="col-3">age1</td>
      </tr>
      <tr>
        <td class="col-3">name..</td>
        <td class="col-3">sName..</td>
        <td class="col-3">age..</td>
      </tr>
      <tr>
        <td class="col-3">nameN</td>
        <td class="col-3">sNameN</td>
        <td class="col-3">ageN</td>
      </tr>
 </table>

.col-3{
   width:33,33%
}

某些记录可能显示为none，因此如果搜索框返回一个完整的“none”列，它将被包装为none，就好像它没有“witdh：33,33％”属性一样。

即使他们没有内容，任何人都知道如何将元素保持原始大小？

提前致谢。

Answer 1

尝试table-layout: fixed以及表格的固定宽度

＆＃13;

table {
  width: 100%;
  table-layout: fixed;
}
.col-3 {
  width: 33, 33%;
  border: 1px solid grey;
}

＆＃13;

<table>
  <tr>
    <td class="col-3">name1 askdlhaslkdhsaldsad asjd;kadaj as;dj;asjd as ;asjsd;asjd;ja</td>
    <td class="col-3">sName1</td>
    <td class="col-3">age1</td>
  </tr>
  <tr>
    <td class="col-3">name..</td>
    <td class="col-3">sName..</td>
    <td class="col-3">age..</td>
  </tr>
  <tr>
    <td class="col-3">nameN</td>
    <td class="col-3">sNameN</td>
    <td class="col-3">ageN</td>
  </tr>
</table>

＆＃13;

Answer 2

试试这个：

<table style="border:1px solid">
    <tr>
        <td style="min-width:50px">one</td>
        <td style="min-width:100px">two</td>
    </tr>
</table>

当我添加/删除文本时，如何保持我的div不会调整大小？

2 个答案: