How do I add a Css file to my Class library?


Tags: c#,asp.net,css,class-library

Problem :

I have a class library which is being used by another project, it is added in the toolbox, then dragged onto the page. Works great!

Only problem is that I want some styling added.

In my class library I have:

  1. added a css file "PayMyBillClassLibrary.main.css",

  2. added the following to the AssemblyInfo:

    [assembly: WebResource("PayMyBillClassLibrary.main.css", "text/css")]

  3. added the css file in the main class using the following code:

        string cssUrl = Page.ClientScript.GetWebResourceUrl(this.GetType(), "PayMyBillClassLibrary.main.css");
    
        HtmlLink cssLink = new HtmlLink();
        cssLink.Href = cssUrl;
        cssLink.Attributes.Add("rel", "stylesheet");
        cssLink.Attributes.Add("type", "text/css");
    
        this.Page.Header.Controls.Add(cssLink);  
    

This produces the following in the solution that I mentioned earlier which hold the class library.

<link href="/TestTwo/WebResource.axd?d=DkBjNt27-P0jDJmlJk7Z40MOLq_coWgDQBzgcFJIGLo-9W-RQClfELNEGAApBuu-kkPiYrB_2uU24xTCwXsn5uKPcaWSRY7vHpLnJEGzoCJ9DdIrd-9StVNbLyRKSYvvUA4x2w2&amp;t=634563635276884818" rel="stylesheet" type="text/css" />

If I click on the link in the view source, it just shows a blank page, if I change the CSS reference to murr.css it will say not found. So it seems to be finding the CSS file, but not doing anything with it or picking up the CSSin the file.

Does anyone have any suggestions?



Solution :

You could try putting a literal control in the header, and setting the literal content in code-behind.

<asp:Literal id="cssliteral" runat="server" /> 

Code-behind:

cssLiteral.Text = String.Format("<link href='{0}' rel='stylesheet' type='text/css' />", cssUrl);

    CSS Howto..

    How to style focused and visited anchors when scrolling with CSS / jQuery

    Show nested list on click in Joomla (1.7.0)

    How to style for only non-touch devices in css?

    How to create desktop widgets [closed]

    How do I add or change the class attribute of a JSF dataTable (primefaces)?

    How to check if svg element supports css transform

    How to set the CSS content property with a Google Material Icon?

    How to align a button inside a DIV

    How to style nested element that is styled by its parent already

    How do I make this nested div to show up on top right corner and make text wrap around it?

    How do I get an object from d3.data()?

    How to achieve this button-border effect with CSS? (image included)

    How to apply custom CSS on Facebook comment box plugin

    How to change the font size in table cells according to cells content?

    how to change the opacity of the text along with the colorscale of the image in css?

    How to change font-color for disabled input?

    How to make a multi category filter with JQuery, HTML and CSS

    How to adjust CSS to make footer fixed height?

    How to write page specific CSS in backbone js

    How to convert a xml element into url using css?

    How to implement this to my index.html?

    How to make image “hang over” above background?

    css how to depend one div to another one in auto adjusting width

    How to make 2 divs on 1 side (up&down)

    How to make three columns all the full height of the page?

    How to make an empty div or container glow with pure CSS?

    How can I alter this CSS so that it only applies to a certain div?

    How do I change the alignment of my search box?

    How to center two square blocks in page?

    How do three.js transforms and CSS3 3D-transforms correspond?