HTML fixed header in table dynamically in ASP.NET - html

Question

I created a table dynamically, being populated from database. What want to do is to created a fixed header and a scrollable body. I tried css and javascript but didn't manage to do anything, I think because table is created automatically.
Help.
Here is my code:
private void GenerateTable();
{
DataTable dt = CreateDataTable();//in CreateDataTable I just take all my reocrds from database
Table table = new Table();
TableRow row = null;
row = new TableRow();
for (int j = 0; j < dt.Columns.Count; j++)
{
TableHeaderCell headerCell = new TableHeaderCell();
headerCell.Text = dt.Columns[j].ColumnName;
row.Cells.Add(headerCell);
}
table.Rows.Add(row);
//Add the Column values
for (int i = 0; i < dt.Rows.Count; i++)
{
row = new TableRow();
for (int j = 0; j < dt.Columns.Count; j++)
{
TableCell cell = new TableCell();
cell.Text = dt.Rows[i][j].ToString();
row.Cells.Add(cell);
}
table.Rows.Add(row);
}
tablediv.Controls.Add(table);
}
Div where I add the table:
<div class="mainEntry" style="width:90%" id="tablediv" runat="server" />
And my CSS for table:
table {
border-collapse: collapse;
width: 100%;
color: white;
}
th, td {
text-align: left;
padding: 8px;
}
th{
font-size:20px;
}
tbody{
height:500px;
overflow:auto;
display:block;
}
tr:nth-child(even){background-color: rgba(255, 255, 255, .15)}
th {
background-color: rgba(174, 183, 212, .15);
color: white;
}

Answer 1

I hope this css classes demo can help you. Visit fiddlehttp://jsfiddle.net/TweNm/