CODEWITHSUNDEEP
asp.netcssmaster-pages
Termiux
Termiux

Reputation: 418

How to apply master page and css to child page

I have a master page to apply to all my pages, the master page is doing its work however, it seems that is unable to resolve the CSS file address for pages I have in child folders.

I have a set of folders like this:

RootContent
      UsersContent
      AdminContent

Since the master page and css files are on the Root content, when the master page tries to locate the css file inside UsersContent or AdminContent it cannot find it.

I'm using JavaScript to detect the browser and set the css properly for most browsers and another file for IE6 since is required in here, any ideas?.

<script type="text/javascript">
    if((BrowserDetect.browser.toString() == "Firefox") && (BrowserDetect.version.toString() == "3.5"))
    {
        document.write('<link rel="Stylesheet" href="<%=ResolveUrl("~/StyleSheet.css") %>" type="text/css" />');
    }
    else if((BrowserDetect.browser.toString() == "Explorer") && (BrowserDetect.version.toString() == "6"))
    {
        document.write('<link rel="Stylesheet" href="~/StylesheetIE6.css" type="text/css" />');
    }
</script>

In the code above I tried <% ResolveUrl("~/StyleSheet.css") %> but didn't work, it works while in the same folder but not on the childs.

EDIT: Just to clarify my CSS file is on my Root Folder not on the childs

Upvotes: 3

Views: 4107

Answers (3)

seanmcgriff
seanmcgriff

Reputation: 63

Have you tried adding runat="server" to the link tag? Worked for me.

Upvotes: 0

user240141
user240141

Reputation:

A simplest way Add App_Themes folder under your web project. Add a theme and under that theme add all css files include their respective image directories.

In your web.config, add

It will automatically get added to the every page.

Note:- In this case all css will get applied. If you have browser specific css, then this is not the way.

[SEE UPDATED]

a CSS file like "iespecific.css" to be loaded by IE 6 and not other browsers, use the following code in the HEAD section of your web page:

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

Likewise, for any version of IE 5 (including 5.0, 5.01, 5.5, etc), use the following:

<!--[if IE 5]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

to detect the release build of IE 5.5, you will need the following code:

<!--[if IE 5.5000]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

For example, to test for all versions of IE greater than or equal to version 6, you can use

<!--[if gte IE 6]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

The above code examples work because a normal browser sees the entire block as HTML comments since they are enclosed within "". IE 5 or above will however attempt to parse the block to see if it has instructions specific to it.

You can also exclude a certain style sheet using this method. For example, to exclude the CSS file "not-ie.css" from IE 6, use:

<![if !(IE 6)]>
<link rel="stylesheet" type="text/css" href="not-ie.css" />
<![endif]>

Notice the operator "!" immediately preceding "IE". This is the NOT operator, causing the statements following to be used only if the expression "IE 6" is not matched by the browser.

Again, the above code works because a normal browser will interpret "" and "<[endif]>" as HTML tags that it does not recognise, and ignore them. This code, however, will not validate as correct in a HTML validator, since it does not use valid HTML tags.

Note that you can also test for IE without specifying a version number. For example, the following loads the style sheet only if the browser is not IE 5 or above:

<![if !IE]>
<link rel="stylesheet" type="text/css" href="not-ie.css" />
<![endif]>

Microsoft's documentation for this non-standard feature can be found at http://msdn2.microsoft.com/en-us/library/ms537512.aspx

Since the documentation does not specify that these features apply only to the Windows versions of IE, I assume that they also apply to the Macintosh version. I'm not able to verify this though.

Upvotes: 2

Bala R
Bala R

Reputation: 108957

I have always used ResolveClientUrl for this purpose. Can you try that instead of ResolveUrl? And here's a post discussing the difference.

Upvotes: 0

Related Questions