I have a weird situation and believe that it must be easy for people to help me out on this specific issue. I have two divs on a child page that i want to show next to each other. I mean, One on left and one on right. After that, on the bottom of the screen I want to display a table that covers 100% width. I have used float left on one div and float right on another div. Then i show the heading of the table on the bottom, then the table displays.
My problem is that the despite all my efforts the heading is displaying in between these two divs. Here is my code.\[code\] <div id="ContainerDiv" runat="server" style="width: 930px"> <div id="DivticketDetails" runat="server" visible="false" style="float: left; width: 400px;"> <asp
anel ID="PanelTicketDetails" runat="server" BackColor="#8B9FBE"> <h3 style="color: #FFFFFF; font-weight: bold; text-decoration: underline;"> Bowzer Details</h3> <table border="1" cellpadding="0" cellspacing="0" class="myTable"> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label6" runat="server" Text="Field / Customer Name" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_FieldName" runat="server" Text="lbl_FieldName" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label3" runat="server" Text="Challan Generated On" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_firstEntryDate" runat="server" Text="lbl_firstEntryDate" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label4" runat="server" Text="Product Name" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_ProductName" runat="server" Text="lbl_ProductName" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label2" runat="server" Text="Bowzer No" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_bowzerNo" runat="server" Text="lbl_bowzerNo" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label28" runat="server" Text="Quantity" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_BowQuantity" runat="server" Text="lbl_BowQuantity" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> </table> </aspanel> </div> <div id="Div2" runat="server" style="float: right; width: 429px;"> <aspanel ID="PanelBowzerHistory" runat="server" BackColor="#8B9FBE" Visible="False"> <h3 style="font-weight: bold; text-decoration: underline; color: #FFFFFF"> Bowzer History </h3> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4" DataKeyNames="challan_id" DataSourceID="DSBowzerHistory" Font-Size="Smaller" ForeColor="#333333" GridLines="None" AllowPaging="True" PageSize="4"> <AlternatingRowStyle BackColor="White" /> <Columns> <asp:BoundField DataField="FirstWeight" HeaderText="FirstWeight" SortExpression="FirstWeight" /> <asp:BoundField DataField="Firstentry_date" HeaderText="Firstentry_date" SortExpression="Firstentry_date" /> <asp:BoundField DataField="SecondWeight" HeaderText="SecondWeight" SortExpression="SecondWeight" /> <asp:BoundField DataField="netWeight" HeaderText="netWeight" SortExpression="netWeight" /> <asp:BoundField DataField="SecondEntry_Date" HeaderText="SecondEntry_Date" SortExpression="SecondEntry_Date" /> <asp:BoundField DataField="challan_id" HeaderText="challan_id" InsertVisible="False" ReadOnly="True" SortExpression="challan_id" /> </Columns> <EditRowStyle BackColor="#2461BF" /> <FooterStyle BackColor="#507CD1" ForeColor="White" Font-Bold="True" /> <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" /> <RowStyle BackColor="#EFF3FB" /> <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" /> <SortedAscendingCellStyle BackColor="#F5F7FB" /> <SortedAscendingHeaderStyle BackColor="#6D95E1" /> <SortedDescendingCellStyle BackColor="#E9EBEF" /> <SortedDescendingHeaderStyle BackColor="#4870BE" /> </asp:GridView> </aspanel> </div> </div> <div id="tblDetailsDiv" runat="server" visible="False" title="Ticket Details" style="width: 930px; background-color: #8B9FBE;"> <h3 style="font-size: medium; color: #FFFFFF; font-weight: bold; width: 930px; background-color: #00FF00;"> Enter Details Here</h3> <table id="tblDetails" title="Enter Details" border="0" cellpadding="0" cellspacing="0" class="myTable" frame="border"> <tr> <td> </td> <td></table></div>\[/code\]and here is how it is displayed.
My problem is that the despite all my efforts the heading is displaying in between these two divs. Here is my code.\[code\] <div id="ContainerDiv" runat="server" style="width: 930px"> <div id="DivticketDetails" runat="server" visible="false" style="float: left; width: 400px;"> <asp
anel ID="PanelTicketDetails" runat="server" BackColor="#8B9FBE"> <h3 style="color: #FFFFFF; font-weight: bold; text-decoration: underline;"> Bowzer Details</h3> <table border="1" cellpadding="0" cellspacing="0" class="myTable"> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label6" runat="server" Text="Field / Customer Name" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_FieldName" runat="server" Text="lbl_FieldName" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label3" runat="server" Text="Challan Generated On" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_firstEntryDate" runat="server" Text="lbl_firstEntryDate" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label4" runat="server" Text="Product Name" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_ProductName" runat="server" Text="lbl_ProductName" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label2" runat="server" Text="Bowzer No" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_bowzerNo" runat="server" Text="lbl_bowzerNo" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> <tr> <td bgcolor="#507CD1"> <asp:Label ID="Label28" runat="server" Text="Quantity" Font-Bold="True" Font-Size="XX-Small" BorderColor="#507CD1" ForeColor="White"></asp:Label> </td> <td> <asp:Label ID="lbl_BowQuantity" runat="server" Text="lbl_BowQuantity" Font-Size="Small" CssClass="myLabel"></asp:Label> </td> </tr> </table> </aspanel> </div> <div id="Div2" runat="server" style="float: right; width: 429px;"> <aspanel ID="PanelBowzerHistory" runat="server" BackColor="#8B9FBE" Visible="False"> <h3 style="font-weight: bold; text-decoration: underline; color: #FFFFFF"> Bowzer History </h3> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4" DataKeyNames="challan_id" DataSourceID="DSBowzerHistory" Font-Size="Smaller" ForeColor="#333333" GridLines="None" AllowPaging="True" PageSize="4"> <AlternatingRowStyle BackColor="White" /> <Columns> <asp:BoundField DataField="FirstWeight" HeaderText="FirstWeight" SortExpression="FirstWeight" /> <asp:BoundField DataField="Firstentry_date" HeaderText="Firstentry_date" SortExpression="Firstentry_date" /> <asp:BoundField DataField="SecondWeight" HeaderText="SecondWeight" SortExpression="SecondWeight" /> <asp:BoundField DataField="netWeight" HeaderText="netWeight" SortExpression="netWeight" /> <asp:BoundField DataField="SecondEntry_Date" HeaderText="SecondEntry_Date" SortExpression="SecondEntry_Date" /> <asp:BoundField DataField="challan_id" HeaderText="challan_id" InsertVisible="False" ReadOnly="True" SortExpression="challan_id" /> </Columns> <EditRowStyle BackColor="#2461BF" /> <FooterStyle BackColor="#507CD1" ForeColor="White" Font-Bold="True" /> <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" /> <RowStyle BackColor="#EFF3FB" /> <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" /> <SortedAscendingCellStyle BackColor="#F5F7FB" /> <SortedAscendingHeaderStyle BackColor="#6D95E1" /> <SortedDescendingCellStyle BackColor="#E9EBEF" /> <SortedDescendingHeaderStyle BackColor="#4870BE" /> </asp:GridView> </aspanel> </div> </div> <div id="tblDetailsDiv" runat="server" visible="False" title="Ticket Details" style="width: 930px; background-color: #8B9FBE;"> <h3 style="font-size: medium; color: #FFFFFF; font-weight: bold; width: 930px; background-color: #00FF00;"> Enter Details Here</h3> <table id="tblDetails" title="Enter Details" border="0" cellpadding="0" cellspacing="0" class="myTable" frame="border"> <tr> <td> </td> <td></table></div>\[/code\]and here is how it is displayed.