How can I add a css class to an updatepanel in ASP.Net? How can I add a css class to an updatepanel in ASP.Net? asp.net asp.net

How can I add a css class to an updatepanel in ASP.Net?


you can use single class html attribute

 <asp:UpdatePanel ID="UpdatePanel1" runat="server" class="MyCssClass"> </asp:UpdatePanel>


As you've seen the update panel doesn't have a css class property. So since it can't be done directly you need a work around; there are two (Grabbed from UpdatePanel and CSS) that can get the behavior you desire.

One is to surround the update panel with a div:

<div id="foo" style="visibility: hidden; position: absolute">    <asp:UpdatePanel ID="UpdatePanel1" runat="server">    </asp:UpdatePanel></div>

The other is to apply a css selector based on the update panel's id:

<style type="text/css">#<%=UpdatePanel1.ClientID%> {    visibility: hidden;    position: absolute;}</style>

Yet another way not mentioned in the article is surround the panel in a div and style the update panel based on it rendering as a div:

<style type="text/css">#foo div {    visibility: hidden;    position: absolute;}</style><div id="foo">    <asp:UpdatePanel ID="UpdatePanel1" runat="server">    </asp:UpdatePanel></div>


An update panel can render as a div or span (depending on mode). Easiest way to achieve what you want is to wrap the UpdatePanel in a standard Panel:

<asp:Panel ID="Panel1" runat="Server">    <asp:UpdatePanel ID="UpdatePanel1" runat="server">    </asp:UpdatePanel></asp:Panel>

The you can just do this in codebehind:

Panel1.CssClass = "myCssClass";

You could also use a div, like LFSR Consulting said, and add runat="server" and then change the class attribute. But Panel is a bit easier to work with (a Panel just renders as a div).