小编new*_*967的帖子

我是网络编程的新手,所以我可能在这里犯了一些明显的错误.

当我试图在诸如rows [i] .style.display ='none'之类的javascript中隐藏表中的行时,表格布局会完全破坏.最初,细胞内容被包裹起来,桌子的宽度也在缩小.然后我在table标签中添加了style ="table-layout:fixed",并在每个td中添加了style ="white-space:nowrap".这会阻止换行,但内容仍然没有在一行上对齐.如果空间和列宽从一行到另一行变化,则单元格开始向左移动.然后,我为每个th和td元素以及包含该表的div添加了固定宽度.问题仍然存在.

我目前的HTML类似于以下内容.

<div style="width: 300px">
  <table id="errorTable" width="100%" cellpadding="5" cellspacing="2" style="table-layout: fixed"> 
    <tr id="HeaderRow">
      <th style="width: 100px;">Header 1</th>
      <th style="width: 50px;">Header 2</th>
      <th style="width: 150px;">Header 3</th>
    </tr>
    <tr id="DetailRow1">                                        
      <td style="white-space:nowrap; width: 100px;">Data 1_1 in Row 1</td>
      <td style="white-space:nowrap; width: 50px;">Data 1_2  in Row 1</td>
      <td style="white-space:nowrap; width: 150px;">Data 1_3 in Row 1</td>
    </tr>
    <tr id="DetailRow2">                                        
      <td style="white-space:nowrap; width: 100px;">Data 2</td>
      <td style="white-space:nowrap; width: 50px;">Data 2</td>
      <td style="white-space:nowrap; width: 150px;">Data 2</td>
    </tr>
    <tr id="DetailRow3"> …