ASP Fixed Header and Footer

First time asking a question on here and relatively new to ASP, VB and CSS but I can't seem to figure out or find an answer to this problem anywhere.

I have SQL data that I am pulling into a Data Table and need it to display with a repeater with a fixed header and footer with the items being scrollable.

I've found that using 3 separate tables is probably the only way I'm going to be able to do this but when I do that, the vertical columns will not line up consistently. I have included the header on the item table to specify the column widths there instead of in the repeater item template but that introduces the problem of having a slight header and the top of the item table.

Keep in mind that the data in the item table will constantly be updated and I hope to make the columns sortable eventually.

Thanks in advance for any ideas.
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div id="contentbody">
        <div class="header"><h1>All Activity Logs</h1></div>                
        <div id="tablecontent">
            <table width="917" border="1" cellpadding="2" cellspacing="0" class="rowdl">
                            <th width="160" height="35">Name</th>
                            <th id="ex_dt" width="60">Date</th>
                            <th id="ex_name" width="200">Activity</th>
                            <th id="int_id" width="100">Intensity</th>
                            <th id="ex_time" width="95">Time</th>
                            <th id="ex_mile" width="95">Mileage</th>
                            <th id="ex_pts_per" width="95">Pts Per</th>
                            <th id="ex_tot_pts" width="112">Total Pts</th>
            <div id="scrolllist">
                <asp:Repeater ID="Repeater1" runat="server">
                        <table width="900" border="1" cellpadding="2" cellspacing="0" class="rowdl">
                            <th width="160" height="0"></td>
                            <th id="ex_dt" width="58"></td>
                            <th id="ex_name" width="199"></td>
                            <th id="int_id" width="100"></td>
                            <th id="ex_time" width="97"></td>
                            <th id="ex_mile" width="97"></td>
                            <th id="ex_pts_per" width="96"></td>
                            <th id="ex_tot_pts" width="95"></td>
                            <td height="20" class="rowdl"><%#Container.DataItem("full_name")%>&nbsp;</td>
                            <td class="rowdr"><%#NullDate(Container.DataItem("ex_dt"))%></td>
                            <td class="rowdl">&nbsp;<%#NullString(Container.DataItem("ex_name"))%></td>
                            <td class="rowdl">&nbsp;<%#NullString(Container.DataItem("int_id"))%></td>
                            <td class="rowdr"><%#NullString(Container.DataItem("ex_time"))%>&nbsp;</td>
                            <td class="rowdr"><%#NullNumber(Container.DataItem("ex_mile"), "#,#0.00; (#,#0.00); #,#0.00", "0.0")%>&nbsp;</td>
                            <td class="rowdr"><%#NullNumber(Container.DataItem("ex_pts_per"), "#,#0.0; (#,#0.0); #,#0.0", "0.0")%>&nbsp;</td>
                            <td class="rowdr"><%#NullNumber(Container.DataItem("ex_tot_pts"), "#,#0.0; (#,#0.0); #,#0.0", "0.0")%>&nbsp;</td>
            <table width="917" border="1" cellpadding="2" cellspacing="0" class="rowdl">
                    <td width="160" height="20" class="blankbg"></td>
                    <td class="blankbg" width="60"></td>
                    <td class="blankbg" width="200"></td>
                    <td class="blankbg" width="100"></td>
                    <td class="rowdr" width="95">AVG Time</td>
                    <td class="rowdr" width="95">Mileage</td>
                    <td class="rowdr" width="95">Pts Per</td>
                    <td class="rowdr" width="112">Total Points&nbsp;&nbsp;&nbsp;&nbsp;</td>

Open in new window

Who is Participating?
Jens FiedererConnect With a Mentor Test Developer/ValidatorCommented:
Your method depends to a degree on which browsers you are planning to support.

The method at

works with most of the newer ones.
WCCrobertAuthor Commented:
Solution was not entirely specific to my problem but guided me to finding the solution.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.