如何解决TR的高度？
是否有可能修复表（TR）的高度？
当我缩小浏览器的窗口时，会出现问题，有些行开始播放，我无法修复该行的高度。
我尝试了几种方法： tr width="20" / tr style="height:20px" / td height="20" / td style="height:20px"
我正在使用IE7
样式
.tableContainer{ color:#0076BF; margin: -10px 0px -10px 0px; border-spacing: 10px; empty-cells:show; width:90%; text-align:left; } .tableContainer tr td{ white-space:nowrap; text-align:left; }
HTML代码。
<table class="tableContainer" cellspacing="10px"> <tr style="height:15px;"> <td>NHS Number</td> <td> </td> <td>Date of Visit</td> <td> </td> <td colspan="3">Care Time Started</td> <td> </td> <td rowspan="2" style="text-align:right;vertical-align:bottom;">☑</td> <td rowspan="2" style="font-weight:bold;vertical-align:bottom;">Tick when<br/> care starts</td> </tr> <tr> <td width="90" class="tableContainerRow2"> </td> <td > </td> <td width="80" class="tableContainerRow2"> </td> <td > </td> <td width="40" class="tableContainerRow2"> </td> <td width="5">:</td> <td width="40" class="tableContainerRow2"> </td> <td > </td> </tr> </table>
表格是固定的（至less在IE中），当涉及到固定高度，而不是包装文本。 我想你会发现唯一的解决scheme是将文本放在一个div元素，如下所示：
td.container > div { width: 100%; height: 100%; overflow:hidden; } td.container { height: 20px; }
<table> <tr> <td class="container"> <div>This is a long line of text designed not to wrap when the container becomes too small.</div> </td> </tr> </table>
尝试将高度放入其中一个单元格中，如下所示：
<table class="tableContainer" cellspacing="10px"> <tr> <td style="height:15px;">NHS Number</td> <td> </td>
但请注意，您将无法使单元格小于内容要求的单元格。 在这种情况下，您必须先将文字缩小一些。
将td高度设置为小于其内容的自然高度
由于表格单元至less要大到可以封装它们的内容，如果内容没有明显的高度，单元格可以任意resize。
通过调整单元格大小，我们可以控制行高。
一种方法是将内容设置为relative单元格中的absolute位置，并设置单元格的height以及内容的left和top 。
table { width: 100%; } .set-height td { position: relative; overflow: hidden; height: 2em; } .set-height p { position: absolute; margin: .1em; left: 0; top: 0; }
<table><tbody> <tr class="set-height"><td><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></td></tr> <tr><td>Foo</td></tr> <tr><td>Bar</td></tr> <tr><td>Baz</td></tr> <tr><td>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td></tr> </tbody></table>
把div放在td里面对我很有用。
<table width="100%"> <tr><td><div style="font-size:2px; height:2px; vertical-align:middle;"> </div></td></tr>
你的桌子宽度是相对于它的容器的90％。
如果你挤压页面，你可能也会挤压桌子的宽度。 单元格的宽度也减小，浏览器通过增加高度来补偿。
要保持高度不变，必须确保单元格的宽度可以容纳内容。 修复表宽度可能是你想尝试的东西。 或者也许玩桌子的最小宽度。
我必须这样做才能得到我想要的结果：
<td style="font-size:3px; float:left; height:5px; vertical-align:middle;" colspan="7"><div style="font-size:3px; height:5px; vertical-align:middle;"><b><hr></b></div></td>
它拒绝只与单元格或div工作，并需要两个。
那是因为这个词正在包装，并且正在延续新的路线，从而拉长了TR。 这应该解决你的问题：
overflow:hidden;
把它放在TR风格中虽然它应该起作用，但为什么不让它伸展o0
PS。 我没有testing它，所以不讨厌XD
