ASP.NET markup has two controls, A, then B. Why does B appear first?

Question

Here's my full markup:

<%@page Title="" Language="VB" MasterPageFile="~/Master Pages/MasterPage.master" AutoEventWireup="false" CodeFile="Statistics.aspx.vb" Inherits="Statistics" %>

<%@ Register Assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="phPageContent" runat="Server">
    <asp:Label ID="Label1" runat="server" Text="Label" CssClass="CaptionLabel"></asp:Label>
    <asp:DropDownList ID="DropDownList1" runat="server" CssClass="DefaultDropDown" />
    <asp:Chart ID="Chart1" runat="server" Height="438px" Width="877px" Palette="Bright">
        <Series>
            <asp:Series ChartArea="ChartArea1" ChartType="Line" Legend="Legend1" Name="Clicks">
            </asp:Series>
            <asp:Series ChartArea="ChartArea1" ChartType="Line" Legend="Legend1" Name="Conversions">
            </asp:Series>
        </Series>
        <ChartAreas>
            <asp:ChartArea Name="ChartArea1">
                <AxisY Title="Count" TitleFont="Microsoft Sans Serif, 10pt">
                </AxisY>
                <AxisX Title="Month" TitleFont="Microsoft Sans Serif, 10pt">
                </AxisX>
                <AxisY2 TextOrientation="Rotated270" Title="Commission (USD)" TitleFont="Microsoft Sans Serif, 12pt, style=Bold">
                </AxisY2>
            </asp:ChartArea>
        </ChartAreas>
        <Legends>
            <asp:Legend Name="Legend1" Title="Legend">
                <CellColumns>
                    <asp:LegendCellColumn Name="Column1" Text="#SERIESNAME">
                        <Margins Left="15" Right="15" />
                    </asp:LegendCellColumn>
                    <asp:LegendCellColumn ColumnType="SeriesSymbol" Name="Column2">
                        <Margins Left="15" Right="15" />
                    </asp:LegendCellColumn>
                </CellColumns>
            </asp:Legend>
        </Legends>
        <Titles>
            <asp:Title Font="Microsoft Sans Serif, 12pt" Name="Title1" Text="Monthly Clicks and Conversions ">
            </asp:Title>
        </Titles>
    </asp:Chart>
</asp:Content>

And here's how it renders. The code behind simply adds the points.

Why does the CHART appear AFTER the label and drop down list control if the label appear first in the flow?

Answer 1

The dropdownlist IS appearing after the chart. If the chart had a border or if you were to add a

tag after the dropdown, this will become more obvious.