ansaurus

Question

Use the same CSS file for masterpage and page content

Answer 1

+1 A:

What about this?

<link runat="server" href="~/apps/_lib/ui/styles1.css" type="text/css" rel="stylesheet" />
<link runat="server" href="~/apps/_lib/ui/styles2.css" type="text/css" rel="stylesheet" />

Time Machine 2009-07-23 14:52:21

Nope, sorry... doesn't make a difference.

Kris 2009-07-23 18:15:10

Answer 2

A:

It looks like you have done it correctly, so your error seems weird and sounds like maybe you've mady a typo in the master page. Try to look at the generated source (view source in the browser) of the two pages, one with the links in the master pages and one with the links in the web page, and compare the paths.

Jan Aagaard 2009-07-23 14:57:57

Answer 3

A:

Something like this should work. You should be able to include the css in the header of the master. And then, include a ContentPlaceHolder in the header so if you need custom header stuff in your content pages you can do that. Does that not work?

<head>

<link href="/apps/_lib/ui/styles1.css" type="text/css" rel="stylesheet" />
<link href="/apps/_lib/ui/styles2.css" type="text/css" rel="stylesheet" />


<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>

Ultimately you don't want a

<head></head>

tag in your content page, it's possible that is overriding your master page header.

brendan 2009-07-23 14:58:12

Answer 4

+1 A:

Is the content page in a different folder that the master? If so, you'll have to get the application relative path to the css files using ResolveUrl in the master page:

<link href='<%= ResolveUrl("~/apps/_lib/ui/styles1.css") %>' type="text/css" rel="stylesheet" />

Update: If this doesn't work, then you might have HTML or CSS errors like Lance suggested. Try using the HTML and CSS validators at w3schools.com. If it still doesn't work after fixing any errors, double check your CSS selectors with the rendered HTML as Steve suggested. ASP.Net's generated IDs have bitten me more than once.

jrummell 2009-07-23 15:37:50

I think jrummell might be one to something. The css styles from the link in the masterpage should apply to the contentpage.

Steve 2009-07-23 16:02:15

I thought that might be the case too, so I tried moving them to the same directory, but I still get this same problem.

Kris 2009-07-23 18:39:14

When I do this... <link href='<%= ResolveUrl("~/apps/_lib/ui/styles.css") %>' type="text/css" rel="stylesheet" />I renders in HTML as this... <link href="CommonUI/%3C%25=%20ResolveUrl(%22~/apps/_lib/ui/styles.css%22)%20%25%3E" type="text/css" rel="stylesheet" />Which doesn't work.

Kris 2009-07-24 14:03:59

That's odd, it works for me. Is your link inside head with runat="server"?

jrummell 2009-07-24 16:03:55

I agree it's very odd. And I did include runat="server" in the head tags.

Kris 2009-07-30 16:35:56

Answer 5

+1 A:

What jrummell posted is what I use on my sites to ensure that the links work if I were to move my pages around.

As far as rendering. The rendering is done on the client machine's browser. To the browser it has no idea the html is generated from multiple documents.

I would make sure your HTML and CSS are correct.

On a side note i have noticed the last week or so that VS2008 keeps messing my css stylesheets up, doing really random things like moving text around. However, I think this might just be something on my machine. Just something to check.

Here is some sample code I checked this just to make sure and this works.

Head of Master Page

<head runat="server">
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
</head>

Content Place Holder

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="something">
        Lance
    </div>
</asp:Content>

Css in StyleSheet

.something{
    color:Blue;
}

The result is "Lance" in Blue in the child page.

Lance Ingle 2009-07-23 20:44:09

Verified this with a new tag and css class and it worked. Looked more closely at the CSS and the found that the wrong css class to display error messages was being applied (an easy to make error given how closely the two classes were named). Seems to work right now that I renamed things.

Kris 2009-07-30 16:37:54

Good, I'm glad i could help.

Lance Ingle 2009-08-03 12:55:18

Answer 6

+1 A:

Maybe it might be your css selectors. When you add master pages, asp.net tacks on more prefixes to the ids.

Steve 2009-07-23 23:37:56

Answer 7

+1 A:

I had a similar problem. As others have suggested, you should be able to use ResolveUrl to make sure the path is correct.

Unfortunately, this created a further problem for me. My head tag was runat server. My link tags were not. The resolve url within my link tag would never execute. Instead, the C# code and response.write tags were being encoded and outputted to the page.

Bizarrely, the same technique in a script (non-runat server) tag would work as normal.

To solve the problem, I ended up writing the whole link tag within an ASP.Net Response.Write tag:

<%="<link href='" + ResolveUrl("~/apps/_lib/ui/styles.css") + "' rel='stylesheet' type='text/css' />"%>

That worked. How strange. Somehow, it is all related to the head tag being runat sever.

2009-08-03 17:46:02

ansaurus

tags:

views:

answers:

Use the same CSS file for masterpage and page content

related questions