Override "table-layout: fixed" for a single row?

Question

I'm creating a table with the styling table-layout: fixed;, and when you click on a row, it expands in height and gives you more information. To do this, I need to have a <div> element inside a <td> that takes up the entire width of the table. That means that I have to somehow override the fixed table layout for a single <td> in one row. I tried the following:

table {
  table-layout: fixed;
  width: 75vw;  /* Full table is 75vw; each cell is ~18vw */
}

.expanded {
  width: 75vw !important;  /* Make expanded <td> element full table width */
}

This didn't work, and it remained the same size. Is there another way to override the table-layout: fixed; attribute?