<td> not obeying `width` or `max-width` attributes?
alignment, cell, css, html, html-table
Solution
You need to use `display:table-row;` instead of `display:block;` on your `<tr>` tags.
Alternatively, you could toggle a class with `display:none;` instead of toggling the `display` value.
Problem
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> <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="AllDay-@item.ExternalID" style="width: 160px;">@(item.AllDay.HasValue && item.AllDay.Value == true ? "Yes" : "No")</td> </tr> @*Should display StartTime & EndTime if AllDay == true??*@ <tr id="StartTime-@item.ExternalID" 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="StartTime-@item.ExternalID" style="width: 160px;">@item.StartTime</td> </tr> <tr id="EndTime-@item.ExternalID" 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="EndTime-@item.ExternalID" 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 force all the table data cells in the nested table to align properly?