Column width of table not correctly

Question

Because I'm newbie so I am facing a problem when I want to set value for column width of table (using code C#)

I want to exhibit like picture

But when I code:

    private void Form1_Load(object sender, EventArgs e)
    {
       // TableLayoutPanel tableLayoutPanel = new TableLayoutPanel();

        tableLayoutPanel.ColumnCount = 3;
        tableLayoutPanel.RowCount = 1;

        tableLayoutPanel.CellBorderStyle = TableLayoutPanelCellBorderStyle.OutsetDouble;
        tableLayoutPanel.Dock = DockStyle.Top;
        tableLayoutPanel.Height = 100;

        tableLayoutPanel.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 10F));
        tableLayoutPanel.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 60F));
        tableLayoutPanel.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 30F));

        #region Create Label1, label2, label3         
        Label label1 = new Label();
        label1.Text = "Width 10%";
        //label1.Dock = DockStyle.Fill;  

        Label label2 = new Label();
        label2.Text = "Width 60%";
        //label1.Dock = DockStyle.Fill;

        Label label3 = new Label();
        label3.Text = "Width 30%";
        //label1.Dock = DockStyle.Fill;
        #endregion 

        tableLayoutPanel.Controls.Add(label1, 0, 0);
        tableLayoutPanel.Controls.Add(label2,1,0);
        tableLayoutPanel.Controls.Add(label3, 2, 0);
    }

The Column width not correct as bellow

I don't know why. pls tell me and how to fix it. Thannks for reading

Answer 1

You probably have existing ColumnStyles already in your collection. Setting the ColumnCount does not reset that collection. Simply clear it out before adding your new ones:

tableLayoutPanel.ColumnStyles.Clear();
tableLayoutPanel.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 10F));
tableLayoutPanel.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 60F));
tableLayoutPanel.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 30F));