Question

I want to use CSS to format my GridView rows.

I’ve set up my GridView in the aspx like so:

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

I set and bind the data source in the code-behind by calling a method to get my data set from a data access layer.

However, because I set the datasource programmatically, the rows and cells have no id attributes.

How can you use CSS to style and format those rows and cells?

This is the HTML generated currently:

<div>
    <table cellspacing="0" rules="all" border="1" id="ContentPlaceHolderHome_GridView1" style="border-collapse:collapse;">
        <tr>
            <th scope="col">Date</th><th scope="col">Project</th><th scope="col">Amount</th>
        </tr><tr>
            <td>1/1/2011 12:00:00 AM</td><td>MY COMPANY</td><td>1000.99</td>
        </tr><tr>
            <td>2/1/2011 12:00:00 AM</td><td>ABC Company</td><td>1001.99</td>
        </tr><tr>
            <td>1/3/2011 12:00:00 AM</td><td>MY COMPANY</td><td>1002.99</td>
        </tr><tr>
            <td>4/1/2011 12:00:00 AM</td><td>MY COMPANY</td><td>1003.99</td>
        </tr>
    </table>
</div>

Answer 1

use selector like this

  <style>
    #ContentPlaceHolderHome_GridView1 td {
     background : #ccc;
   }
  </style>