Styling a repeater inside a datalist - html

Question

i've used a DataList (dlparent) control for one of my page. Inside that datalist is another Datalist (dlchild) that is being populated by itemdatabound event of the parent datalist. i've used css with dlchild.
Databinding is ok and the required output shows great with mozilla and IE but not in netscape, safari and google chrome. dlchild is not showing. only item in dlparent appears.
Here's the markup for the dlparent:
<asp:DataList ID="SprintsWorkData" Style="float: left; padding-top: 10px;" runat="server"
OnItemDataBound="SprintsWorkData_ItemDataBound">
<ItemTemplate>
<asp:HiddenField ID="hiddenSprintId" runat="server" Value='<%# Eval("SprintId") %>' />
<div id="SprintNameSection">
<h4>
<%# Eval("SprintName") %></h4>
</div>
<div id="HeaderSection_SelectAll">
<div style="padding-top: 3px; height: 23px; padding-left: 2px;">
<asp:CheckBox ID="isAllCheck" runat="server" onclick="checkAll(this)" />
<b>
<asp:Label ID="sAll" Style="color: Black; text-indent: 1px;" Text="Select All" runat="server"></asp:Label>
</b>
</div>
</div>
<div class="HeaderSection_WorkedHours">
<b><asp:Literal ID="workedHours" runat="server" Text='<%$ Resources:LanguagePack, Worked_Hours %>'></asp:Literal></b></div>
<div class="HeaderSection_BillableHours">
<b><asp:Literal ID="billableHours" runat="server" Text='<%$ Resources:LanguagePack, Billable_Hours %>'></asp:Literal></b></div>
<div class="HeaderSection_Comments">
<b><asp:Literal ID="comments" runat="server" Text='<%$ Resources:LanguagePack, Comments %>'></asp:Literal></b></div>
<asp:DataList ID="HoursWorkData" runat="server">
<ItemTemplate>
<asp:HiddenField ID="hiddenTaskId" runat="server" Value='<%# Eval("BacklogId") %>' />
<div id="ItemSection_Task_Header">
<div style="vertical-align: middle; padding-bottom: 2px; padding-left: 2px; height: 18px;">
<asp:CheckBox ID="checkboxSub" runat="server" onclick="checkAllSub(this)" />
<b style="text-indent: 1px;">
<%# Eval("Title") %></b>
</div>
</div>
<div id="ItemSection_WorkedHours_Header">
<%# Eval("WorkedHours")%> </div>
<div id="ItemSection_BillableHours_Header">
<asp:Label ID="lblBillableHours_Header" Text='<%# Eval("BillableHours")%>' runat="server"></asp:Label> </div>
<div id="ItemSection_Comments_Header">
</div>
<asp:Repeater ID="repResourcesList" runat="server">
<ItemTemplate>
<asp:HiddenField ID="hiddenReportId1" runat="server" Value='<%# Eval("ReportId") %>' />
<div id="ItemSection_Task_Item">
<div style="vertical-align: middle; padding-bottom: 5px; padding-left: 2px; padding-top: 1px;
height: 14px;">
<asp:CheckBox ID="CB" runat="server" onclick="checkItem(this)" />
<b style="text-indent: 1px;">
<%# Eval("EnteredbyName") %></b>
</div>
</div>
<div id="ItemSection_WorkedHours_Item">
<asp:Label ID="lblWorkedHours_Item" Text='<%# Eval("WorkedHours")%>' runat="server"></asp:Label> </div>
<div id="ItemSection_BillableHours_Item">
<asp:RegularExpressionValidator ValidationGroup="ApproveBillable" ID="RegularExpressionValidator1"
runat="server" ErrorMessage="*" ValidationExpression="^(-)?\d+(\.\d\d)?$" ControlToValidate="txtBillableHours"
Style="position: absolute;">*</asp:RegularExpressionValidator>
<asp:TextBox ID="txtBillableHours" Style="text-align: right" runat="server" Font-Size="12px"
Width="50px" Text='<%# Eval("BillableHours") %>'></asp:TextBox>
</div>
<div id="ItemSection_Comments_Item">
<asp:TextBox ID="txtComments" Font-Size="12px" Width="93px" runat="server" Text='<%# Eval("Comment") %>'></asp:TextBox>
</div>
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
<ItemStyle Height="24px" />
<SeparatorTemplate>
<div id="divSeparator">
</div>
</SeparatorTemplate>
<FooterTemplate>
<div id="Footer1">
TOTAL HOURS
</div>
<div id="Footer_WorkedHours">
<asp:Label ID="lblWorkedHours" runat="server" Text="0.00" Font-Size="12px" ForeColor="White"></asp:Label>
</div>
<div id="Footer_BillableHours">
<asp:Label ID="lblBillableHours_Footer" runat="server" Text="0.00" Font-Size="12px"
ForeColor="White"></asp:Label>
</div>
<div id="Footer_Comments">
</div>
</FooterTemplate>
</asp:DataList>
</ItemTemplate>
<SeparatorTemplate>
</SeparatorTemplate>
</asp:DataList>
What might be the problem?

Answer 1

<asp:DataList ID="SprintsWorkData" Style="float: left; padding-top: 1px;" runat="server"
OnItemDataBound="SprintsWorkData_ItemDataBound">
<ItemTemplate>
<asp:HiddenField ID="hiddenSprintId" runat="server" Value='<%# Eval("SprintId") %>' />
<div id="SprintNameSection">
<h4>
<%# Eval("SprintName") %></h4>
</div>
<div id="HeaderSection_SelectAll">
<div style="padding-top: 3px; height: 23px; padding-left: 2px;">
<asp:CheckBox ID="isAllCheck" runat="server" onclick="checkAll(this)" />
<b>
<asp:Label ID="sAll" Style="color: Black; text-indent: 1px;" Text="Select All" runat="server"></asp:Label>
</b>
</div>
</div>
<div class="HeaderSection_WorkedHours">
<b>
<asp:Literal ID="workedHours" runat="server" Text='<%$ Resources:LanguagePack, Worked_Hours %>'></asp:Literal></b></div>
<div class="HeaderSection_BillableHours">
<b>
<asp:Literal ID="billableHours" runat="server" Text='<%$ Resources:LanguagePack, Billable_Hours %>'></asp:Literal></b></div>
<div class="HeaderSection_Comments">
<b>
<asp:Literal ID="comments" runat="server" Text='<%$ Resources:LanguagePack, Comments %>'></asp:Literal></b></div>
<asp:DataList ID="HoursWorkData" runat="server" Style="float: left;">
<ItemTemplate>
<asp:HiddenField ID="hiddenTaskId" runat="server" Value='<%# Eval("BacklogId") %>' />
<div id="ItemSection_Task_Header">
<div style="vertical-align: middle; padding-bottom: 2px; padding-left: 2px; height: 18px;">
<asp:CheckBox ID="checkboxSub" runat="server" onclick="checkAllSub(this)" />
<b style="text-indent: 1px;">
<%# Eval("Title") %></b>
</div>
</div>
<div id="ItemSection_WorkedHours_Header">
<%# Eval("WorkedHours")%> </div>
<div id="ItemSection_BillableHours_Header">
<asp:Label ID="lblBillableHours_Header" Text='<%# Eval("BillableHours")%>' runat="server"></asp:Label> </div>
<div id="ItemSection_Comments_Header">
</div>
<asp:Repeater ID="repResourcesList" runat="server">
<ItemTemplate>
<asp:HiddenField ID="hiddenReportId1" runat="server" Value='<%# Eval("ReportId") %>' />
<div id="ItemSection_Task_Item">
<div style="vertical-align: middle; padding-bottom: 5px; padding-left: 2px; padding-top: 1px;
height: 14px;">
<asp:CheckBox ID="CB" runat="server" onclick="checkItem(this)" />
<b style="text-indent: 1px;">
<%# Eval("EnteredbyName") %></b>
</div>
</div>
<div id="ItemSection_WorkedHours_Item">
<asp:Label ID="lblWorkedHours_Item" Text='<%# Eval("WorkedHours")%>' runat="server"></asp:Label> </div>
<div id="ItemSection_BillableHours_Item">
<asp:RegularExpressionValidator ValidationGroup="ApproveBillable" ID="RegularExpressionValidator1"
runat="server" ErrorMessage="*" ValidationExpression="^(-)?\d+(\.\d\d)?$" ControlToValidate="txtBillableHours"
Style="position: absolute;">*</asp:RegularExpressionValidator>
<asp:TextBox ID="txtBillableHours" Style="text-align: right" runat="server" Font-Size="12px"
Width="50px" Text='<%# Eval("BillableHours") %>'></asp:TextBox>
</div>
<div id="ItemSection_Comments_Item">
<asp:TextBox ID="txtComments" Font-Size="12px" Width="93px" runat="server" Text='<%# Eval("Comment") %>'></asp:TextBox>
</div>
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
<ItemStyle Height="24px" />
<SeparatorTemplate>
<div id="divSeparator">
</div>
</SeparatorTemplate>
<FooterTemplate>
<div id="Footer1">
<asp:Literal ID="totalHours" runat="server" Text='<%$ Resources:LanguagePack,TOTAL_HOURS %>'></asp:Literal>
</div>
<div id="Footer_WorkedHours">
<asp:Label ID="lblWorkedHours" runat="server" Text="0.00" Font-Size="12px" ForeColor="White"></asp:Label>
</div>
<div id="Footer_BillableHours">
<asp:Label ID="lblBillableHours_Footer" runat="server" Text="0.00" Font-Size="12px"
ForeColor="White"></asp:Label>
</div>
<div id="Footer_Comments">
</div>
</FooterTemplate>
</asp:DataList>
</ItemTemplate>
<SeparatorTemplate>
</SeparatorTemplate>
</asp:DataList>
I've just forgot to add float:left to the inner datalist or dlchild. the parent datalist has float:left