how to fix DataGrid Header with scrollable

<div style=" background-color:Green;  <br mode=" hold=" />        height:30px;width:600px; margin:0;padding:0">
       <table cellspacing="0" cellpadding="0" rules="all" border="1" id="tblHeader">
        style="font-family:Arial;font-size:10pt;width:600px;color:white;
        border-collapse:collapse;height:100%;">
           <tr>
              <td style="width:150px;text-align:center">CustomerID</td>
              <td style="width:150px;text-align:center">City</td>
              <td style="width:150px;text-align:center">Country</td>
              <td style="width:150px;text-align:center">PostalCode</td>
           </tr>
       </table>
       </div>
       <div style="height:200px; width:600px; overflow:auto;">
       <asp:gridview id="GridView1" runat="server" xmlns:asp="#unknown">
           AutoGenerateColumns = "false" Font-Names = "Arial" ShowHeader = "false"
           Font-Size = "11pt" AlternatingRowStyle-BackColor = "#C2D69B" >
          <columns>
           <asp:boundfield itemstyle-width="150px" datafield="CustomerID" />
           <asp:boundfield itemstyle-width="150px" datafield="City" />
           <asp:boundfield itemstyle-width="150px" datafield="Country" />
           <asp:boundfield itemstyle-width="150px" datafield="PostalCode" />
          </columns>
       </asp:gridview>
       </div>