ASP.NET CSS file in master page

Question

Hi All,

In my application I have next problem. I created master page and some content pages, some of which are located in the nested folders. In the master page I added the link to .css file

<link href="default.css" rel="stylesheet" type="text/css" />

But pages are located in the nested folders can't use this .css file. How can I fix this? I want to have one .css file for all pages (:

Thanks!

Answer 1

<link href="~/default.css" rel="stylesheet" type="text/css" />

Answer 2

The css shouldnt be relative to the master page but rather it should be relative to the location of the Page instance using the master page. In most cases this will be the same thing but I would always try to use either a fully qualified path or a site relative path

Fully qualified path

<link href="http://some.site.com/mysite/styles/default.css" rel="stylesheet" type="text/css" /> 

or a relative path (note this might not work if you have a version which can only host one site but many apps such as WinXP)

<link href="/default.css" rel="stylesheet" type="text/css" /> 

Win xp relative path

<link href="/path/to/application/default.css" rel="stylesheet" type="text/css" />

Answer 3

This problem can be resolved by adding next code in master page

<style type="text/css" runat="server">
    @import '<%= ResolveUrl("~/default.css")%>';
</style>

But designer of VS can't process this and you couldn't view your styles in it.

Answer 4

The way you defined you style sheet means: the style sheet is in the same folder as the page which uses it.

If you want to have one style sheet for all pages you should put in in one place (I prefer /assets/css folder in the application root) and define the path using this folder:

<link href="/assets/css/default.css" rel="stylesheet" type="text/css" />

The other way to archieve this is to use Themes, in this case styles will be added automatically.