How do I remove border collapse from the style property when gridview is generated

  • 2020-03-30 04:02:41
  • OfStack

When gridview is used in vs2005, by default the gridview control adds border-collapse:collapse to the style property in the generated HTML code.


<asp:GridView ID="GridView1" runat="server" BorderWidth="0"></asp:GridView>

The code in the page after the binding data runs is:


<table cellspacing="0" rules="all" border="0" id="GridView1" style="border-width:0px;border-collapse:collapse;">
<tr>
<th scope="col">id</th><th scope="col">name</th>
</tr><tr>
<td>1</td><td>1</td>
</tr><tr>
<td>2</td><td>2</td>
</tr>
</table>

The gridview control automatically adds: border-collapse:collapse;

To remove the auto-spacing code just put CellSpacing="-1" and the HTML code is


<table rules="all" border="0" id="GridView1" style="border-width:0px;">
<tr>
<th scope="col">id</th><th scope="col">name</th>
</tr><tr>
<td>1</td><td>1</td>
</tr><tr>
<td>2</td><td>2</td>
</tr>
</table>

One more thing:

GridLines="None" does not display cell borders
CellSpacing="-1" remove border-collapse:collapse in GridView style; style

Note: the problem encountered in the firefox browser, where border merging caused some border lines to thicken, was resolved by GridLines="None"


Related articles: