CSS file referenced twice

Question

I have a asp.net web app that uses themes, iframes, and master pages. I've analyzed the pages with IE Web developer and FF Firebug and noticed that every page references the same css file twice. I don't know if this is because of the master page model or because of the iframe. Anyone have any idea on how to reference the css only once?

Answer 1

Are you referencing this CSS file from the Content pages? If so, this would cause the CSS to be referenced twice. You don't need to reference the CSS from the Content pages, just the Master page.

Answer 2

An iframe is a distinct rendering context, so you really can't reasonably get around it needing to load its CSS. If it uses the same stylesheet as the embedding page, then yeah, that stylesheet will be referenced twice.

Answer 3

I am guessing the answer for you is to stop using IFRAMEs. You can nest master pages if you need to use reusable chunks of content. One reason people use IFRAMEs is when they are serving up content from a remote site, but since you said it is calling the same CSS file, that is not the case.

More information on what the IFRAME is doing would be helpful.

Answer 4

If you set the page theme in the config, all the .css files in the App_Themes/YourTheme folder will be referenced automatically.

<system.web>
    <pages theme="ThemeName">
     <controls>
     </controls>
    </pages>
<system.web>

So, you don't need to add any references to your CSS files.

One catch though, the CSS files will be referenced in alphabetical order (as far as I'm aware there is no way to change this), so if you want one .css file to override another you need to be careful with file names.

Answer 5

I noticed this also...but I removed the "theme" and "stylesheettheme" reference from the web.config file, and the stylesheet link still appears twice...once right after the head tag, and again after the title tag.