title: <td> not obeying `width` or `max-width` attributes?
body: <p>I have a table that displays some information regarding the timespan of an event, and that specific info is in a nested table.</p>
  
  <p>Here's a screenshot:</p>
  
  <p><img src="https://i.stack.imgur.com/0IKti.png" alt="Nested Table"></p>
  
  <p>Here is the <code>&lt;td&gt;</code> that contains the nested table (PLEASE IGNORE THE RAZOR LOGIC):</p>
  
  <pre><code>&lt;td&gt;
      &lt;table class="centered" style="width: 100%; table-layout: fixed; white-space: nowrap;"&gt;
          &lt;tbody&gt;
              &lt;tr&gt;
                  &lt;td class="left-text" style="max-width: 81px; width: 81px;"&gt;&lt;b&gt;All Day?&lt;/b&gt;&lt;/td&gt;
                  &lt;td id="AllDay-@item.ExternalID" style="width: 160px;"&gt;@(item.AllDay.HasValue &amp;&amp; item.AllDay.Value == true ? "Yes" : "No")&lt;/td&gt;
              &lt;/tr&gt;
              @*Should display StartTime &amp; EndTime if AllDay == true??*@
              &lt;tr id="StartTime-@item.ExternalID" style="display: @(item.AllDay.HasValue &amp;&amp; item.AllDay.Value == true ? "none" : "block")"&gt;
                  &lt;td class="left-text" style="max-width: 81px; width: 81px;"&gt;&lt;b&gt;Start Time&lt;/b&gt;&lt;/td&gt;
                  &lt;td id="StartTime-@item.ExternalID" style="width: 160px;"&gt;@item.StartTime&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr id="EndTime-@item.ExternalID" style="display: @(item.AllDay.HasValue &amp;&amp; item.AllDay.Value == true ? "none" : "block")"&gt;
                  &lt;td class="left-text" style="max-width: 81px; width: 81px;"&gt;&lt;b&gt;End Time&lt;/b&gt;&lt;/td&gt;
                  &lt;td id="EndTime-@item.ExternalID" style="width: 160px;"&gt;@item.EndTime&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>On the nested table, I have the following style:</p>
  
  <pre><code>style="width: 100%; table-layout: fixed; white-space: nowrap;"
  </code></pre>
  
  <p>On each left-hand cell (i.e. "All Day?", "Start Time", "End Time") I have the following style:</p>
  
  <pre><code>style="max-width: 81px; width: 81px;"
  </code></pre>
  
  <p>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.</p>
  
  <p>How can I <strong>force</strong> all the table data cells in the nested table to align properly?</p>