How do I prevent table cells from shifting when hiding other cells in table?

Question

As simple as this sounds, I am modifying this tool that should display the vehicle Model for trucks, and hide them for Trailers, etc. I set the display to "none" and "Visible" to false in the code behind, and when I search for a trailer, the cells had moved to the right.

I tried using CSS floats, but nothing worked. I am using my company's template, so I would rather not make too many changes, if possible.

Here are code snippets:

HTML/ASP

 <tr> <td style="display: none;"> <asp:Label ID="lblDisplayModel" runat="server" CssClass="bold" CssStyle="display: none;" Visible="false" /> </td> <td> <asp:Label ID="lblModel" runat="server" CssClass="NormalText" CssStyle="display: none;" name="Model:" Visible="false" /> </td> <td> <label class="control_label">Service Date:</label> </td> <td> <asp:Label ID="lblServiceDate" runat="server" CssClass="NormalText" /> </td> <td> <label class="control_label">District:</label> </td> <td> <asp:Label ID="lblFleetOwnerDistrict" runat="server" CssClass="NormalText" /> </td> </tr>

C#/Code Behind

if (equipment.equipment_type.Contains("TK"))
{
    lblModel.Visible = true;
    lblDisplayModel.Text = "Model:";
    lblDisplayModel.Visible = true;
}
else
{
    lblModel.Visible = false;
    lblDisplayModel.Visible = false;
}

Can someone please give me some hints?

Thank you.

Answer 1

Instead of hiding, try changing the text. The cell (td) probably wants something in there as a kind of padding so add an html space.

I'm not sure which label to use so I'll make one up here.

// don't hide the label, just change the text, if possible.
lblMyLabel.Text = " ";

Not positive it will work but might do it.