Question

I need to set the middle column to 100%. The css works appropriately below unless I change a column width to 100% then it removes all the widths for the other columns. Anyone know why?

.SummaryTable td:first-child
{
    width: 150px;
}
.SummaryTable td:first-child + td
{
    width: 150px; /*100% will remove other col widths*/
}
.SummaryTable td:first-child + td + td
{
    width: 175%;
}

Here is the fiddle

Answer 1

Not setting the width for the middle cell should fix it for you provided the table has width=100%.

The other cells would be fixed but the cells that do not have width specified would fill the screen.

Try this, I think it should work

.SummaryTable td:first-child
{
    width: 150px;
}
.SummaryTable td:first-child + td
{
   /* don't set any width for the middle cell, it would expand */
}
.SummaryTable td:first-child + td + td
{
    width: 150px;
}