Html <td> 不遵守 `width` 或 `max-width` 属性？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17577851/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
<td> not obeying `width` or `max-width` attributes?
提问by Kehlan Krumme
I have a table that displays some information regarding the timespan of an event, and that specific info is in a nested table.
我有一个表格，其中显示了有关事件时间跨度的一些信息，并且该特定信息位于嵌套表格中。
Here's a screenshot:
这是一个屏幕截图：
Here is the <td>that contains the nested table (PLEASE IGNORE THE RAZOR LOGIC):
这是<td>包含嵌套表的（请忽略 RAZOR LOGIC）：
<td>
<table class="centered" style="width: 100%; table-layout: fixed; white-space: nowrap;">
<tbody>
<tr>
<td class="left-text" style="max-width: 81px; width: 81px;"><b>All Day?</b></td>
<td id="[email protected]" style="width: 160px;">@(item.AllDay.HasValue && item.AllDay.Value == true ? "Yes" : "No")</td>
</tr>
@*Should display StartTime & EndTime if AllDay == true??*@
<tr id="[email protected]" style="display: @(item.AllDay.HasValue && item.AllDay.Value == true ? "none" : "block")">
<td class="left-text" style="max-width: 81px; width: 81px;"><b>Start Time</b></td>
<td id="[email protected]" style="width: 160px;">@item.StartTime</td>
</tr>
<tr id="[email protected]" style="display: @(item.AllDay.HasValue && item.AllDay.Value == true ? "none" : "block")">
<td class="left-text" style="max-width: 81px; width: 81px;"><b>End Time</b></td>
<td id="[email protected]" style="width: 160px;">@item.EndTime</td>
</tr>
</tbody>
</table>
</td>
On the nested table, I have the following style:
在嵌套表上，我有以下样式：
style="width: 100%; table-layout: fixed; white-space: nowrap;"
On each left-hand cell (i.e. "All Day?", "Start Time", "End Time") I have the following style:
在每个左侧单元格（即“全天？”、“开始时间”、“结束时间”）上，我有以下样式：
style="max-width: 81px; width: 81px;"
If it's not obvious, none of the nested table's cells are following my style. It's a bit frustrating, since I wasn't even aware that tables could turn into such a ridiculously sloppy mess.
如果不明显，嵌套表格的单元格都没有遵循我的风格。这有点令人沮丧，因为我什至不知道桌子会变成如此可笑的草率混乱。
How can I forceall the table data cells in the nested table to align properly?
如何强制嵌套表格中的所有表格数据单元格正确对齐？
回答by Derek S
You need to use display:table-row;instead of display:block;on your <tr>tags.
您需要在标签上使用display:table-row;而不是。display:block;<tr>
Alternatively, you could toggle a class with display:none;instead of toggling the displayvalue.
或者，您可以切换类display:none;而不是切换display值。
