Create horizontal list of labels / divs inside a panel dynamically

Question

I am trying to create a key for a footer for an aspx page. The footer is a user control and all it contains is an asp:panel.

<asp:Panel ID="pnlFooterKey" runat="server" Height="45px">   

</asp:Panel>

In the code behind I am getting a list of information from a database. Depending on the number returned from the database I want to display up to 10 labels and 10 divs/panels. This I want to do dynamically.

List<string> accnames = AccountNames();
for (int i = 0; i < this.NumberOfAccounts; i++)
{
var accName = accnames[i];
Label lbl = new Label();
Image img = new Image();
img.ImageUrl = "~/Images/ajax-loader-blue.gif";
img.Attributes.Add("style", "padding-right:5px;");
lbl.Attributes.Add("style", "padding-right:15px;");
lbl.Text = accName;
pnlFooterKey.Controls.Add(img);
pnlFooterKey.Controls.Add(lbl);
}

The above works ok for testing purposes, but what I want instead of the image is a div or something similar that I can change the background and border color again depending on the result return from the database.

The key would be display something like this (colored block - Company Name) (colored block - Company Name)

I have tried the following and the though the Company name appears in the center of the page, the blocks appear to the left.

List<string> accnames = AccountNames();
for (int i = 0; i < this.NumberOfAccounts; i++)
{
var accName = accnames[i];
Label lbl = new Label();
Panel pnl = new Panel();
pnl.Attributes.Add("style", "height:15px; width:15px;padding-right:5px;background-color: #cc0000;border:1px solid black;clear:both;");
lbl.Attributes.Add("style", "padding-right:15px;");
lbl.Text = accName;
pnlFooterKey.Controls.Add(pnl);
pnlFooterKey.Controls.Add(lbl);
}

Any help would be much appreciated

Answer 1

I believe what you are asking for is you want the company name inside a new div . If so, you need to add the label to the appropriate panel :

pnl.Controls.Add(lbl);
pnlFooterKey.Controls.Add(pnl);