asp.net - How to change a Panel width programmatically

Change a Panel width programmatically
The Panel class represents a control that acts as a container for other controls. The Panel is especially useful when the asp.net developers want to generate controls programmatically, hide and show a group of controls, or localize a group of controls. The Panel’s Direction property is used to display text in the Arabic language.

The following asp.net c# tutorial code demonstrates how we change the width of a Panel web server control. In the below code example, we used the Panel control’s Width property to change its width programmatically.

The Label Width property gets or sets the width of the Web server control. The Width property is inherited from WebControl. The CssClass property value is a Unit that represents the width of the control. The Width property throws ArgumentException if the width of the Panel server control was set to a negative value.
PanelWidth.aspx

<%@ Page Language="C#" %>

<!DOCTYPE html>

<script runat="server">
    protected void Button1_Click(object sender, System.EventArgs e)
    {
        Panel1.Width = 200;

    }
    protected void Button2_Click(object sender, System.EventArgs e)
    {
        Panel1.Width = 300;
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>How to set, change Panel width programmatically</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h2 style="color:Navy; font-style:italic;">Panel Example: Change Width</h2>
        <asp:Panel 
             ID="Panel1"
             runat="server"
             Height="100"
             Width="100"
             HorizontalAlign="Center"
             ForeColor="SaddleBrown"
             BackColor="AntiqueWhite"
             BorderColor="IndianRed"
             BorderWidth="2"
             Font-Size="X-Large"
             Font-Bold="true"
             >
             <br />
             Change Width
        </asp:Panel>
        <br /><br />
        <asp:Button 
             ID="Button1" 
             runat="server"
             ForeColor="IndianRed"
             Text="Panel Width 200"
             Height="45"
             OnClick="Button1_Click"
             Font-Bold="true"
             />
        <asp:Button 
             ID="Button2" 
             runat="server"
             ForeColor="IndianRed"
             Text="Panel Width 300"
             Height="45"
             OnClick="Button2_Click"
             Font-Bold="true"
             />
    </div>
    </form>
</body>
</html>








Related asp.net example