Home/ Questions/Q 8216841
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-07T12:16:19+00:00

I’m new to working in ASP.NET but I’m developing a custom control that has

  • 0

I’m new to working in ASP.NET but I’m developing a custom control that has a multi view control inside it that displays a bunch of different stuff. Some of it is displayed using JQuery UI elements like tabs and accordians which will have quite a bit of customisation.

Since I’m going to have a lot of CSS rules that apply only to the elements inside the custom control (not to the rest of our web site), I’m wondering where to put the CSS style rules.

I’d normally just put a style sheet somewhere in the site root and reference it from there. But as I play around with ASP.NET, I get the feeling that I should be putting all my code (including CSS, JS, etc) inside the custom control itself. This feels more “programmy”, keeping everything together.

Can anyone adivse how I should be doing this? What’s the best practice for web development in ASP.NET?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If the control you are creating is in a separate assembly, you can embed the CSS files inside the assembly to make it reusable and create a direct link to these files from your control, then in your control you will register them to be rendered as link tags in your page

    Note: Remember that you need to mark the CSS file in your assembly as an Embedded Resource

    Just select your file | then proeprties and change its Build Action property and set it to: embedded Resource

    enter image description here

    In the following code:

    • AjaxEnabled.Web.UI represents the namespace of your assembly

    • DefaultStyle.css represents the embedded CSS file name

    The following code sample shows the steps needed: (in your custom server control)

    [assembly: WebResource("AjaxEnabled.Web.UI.DefaultStyle.css", "text/css")]

    protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);

        if (this.Page.Header != null)
        {
            if (!this.Page.ClientScript.IsClientScriptBlockRegistered("defaultCss"))
            {
                var link = new HtmlLink();

                link.Href = this.Page.ClientScript.GetWebResourceUrl(
                    typeof(YourControlType),
                    "AjaxEnabled.Web.UI.DefaultStyle.css"
                );
                link.Attributes.Add("rel", "stylesheet");
                link.Attributes.Add("type", "text/css");

                this.Page.Header.Controls.Add(link);
                this.Page.ClientScript.RegisterClientScriptBlock(
                    typeof(Page),
                    "defaultCss",
                    string.Empty
                );
            }
        }
    }

    You need to add an instance of the ScriptManager control in your page containing your custom controls

    <asp:ScriptManager runat="server" ID="sm"/>

    And in your ASPX page you need to mark the header section as a server control

    <head runat="server">

    The following code:

    link.Href = this.Page.ClientScript.GetWebResourceUrl(
                typeof(YourControlType),
                "AjaxEnabled.Web.UI.DefaultStyle.css");

    Renders a link directly to the CSS file embedded in the assembly

    This condition:

    if (!this.Page.ClientScript.IsClientScriptBlockRegistered("defaultCss"))
...
this.Page.ClientScript.RegisterClientScriptBlock(
                        typeof(Page),
                        "defaultCss",
                        string.Empty
                    );

    ensures that the CSS is rendered only once in the page, even if you drop more than one instances of your control

    • 0