Using ~/ path for to link a CSS page?

L

Lance Wynn

Hello all,
Is there a way to use the ~/ path to link a CSS page?

I thought maybe something like this would work, but no go:
<link href="~/style.css" rel="stylesheet" type="text/css"/>

Is this possible to do with the link element?

Thanks
 
C

Cowboy \(Gregory A. Beamer\)

~ is filled in by a routine in WebControl (GetClientPath() I think. If not,
it is close). The link is not attached to a control. YOu can code your own
implementation of link that use the routine to covnert ~. Otherwise, you
cannot use ~ to represent route.
 
J

Jialiang Ge [MSFT]

Hello,

From your post, my understanding on this issue is: you wonder how to
resolve the root directory when we link to a style sheet. If I'm off base,
please feel free to let me know.

According to the MSDN article: ASP.NET Web Site Paths
http://msdn2.microsoft.com/en-us/library/ms178116.aspx
"ASP.NET includes the Web application root operator (~), which you can use
when specifying a path in *server controls*. ASP.NET resolves the ~
operator to the root of the current application. You can use the ~ operator
in conjunction with folders to specify a path that is based on the current
root."
Therefore, as Cowboy replied, the link is not attached to a server control,
and the operator '~' cannot be resolved as expected.

Here are two workarounds for your reference:

Workaround 1: Declare 'runat=server' for the <head> element, and use '~'
inside it. For instance,
<head runat="server">
<title>Untitled Page</title>
<link href="~/Css/style.css" rel="stylesheet" type="text/css" />
</head>

Workaround 2:
We can link to the style sheet with some server side codes
(quoted from
http://www.pluralsight.com/blogs/ted/archive/2005/08/31/14437.aspx)
public static void AddLinkedStyleSheet(Page page, string stylesheet)
{
HtmlLink link = new HtmlLink();
link.Href = page.ResolveUrl(stylesheet);
link1.Attributes["text"] = "text/css";
link1.Attributes["rel"] = "stylesheet";

page.Header.Controls.Add(link);
}
MyClass.AddLinkedStyleSheet(this, "~/css/my.css");

Please let me know if you have any other concerns, or need anything else.

Regards,
Jialiang Ge ([email protected], remove 'online.')
Microsoft Online Community Support

==================================================
For MSDN subscribers whose posts are left unanswered, please check this
document: http://blogs.msdn.com/msdnts/pages/postingAlias.aspx

Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/subscriptions/managednewsgroups/default.aspx#notif
ications. If you are using Outlook Express/Windows Mail, please make sure
you clear the check box "Tools/Options/Read: Get 300 headers at a time" to
see your reply promptly.

Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump analysis issues. Issues of this nature are best
handled working with a dedicated Microsoft Support Engineer by contacting
Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/subscriptions/support/default.aspx.
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
 
M

marss

Hello all,
Is there a way to use the ~/ path to link a CSS page?

I thought maybe something like this would work, but no go:
<link href="~/style.css" rel="stylesheet" type="text/css"/>

If you use href="/style.css" it refers to a stylesheet resided in the
root folder of an application
disregarding of position of the parent page in a website hierarchy.
IMHO, no need to convert the stylesheet link to a server control, a
leading slash "/" for HTML elements do the same as "~/" for web/HTML
controls.

Regards,
Mykola
http://marss.co.ua - Casual ideas for web development
 
J

John

Just to add, if you're refering to Master pages then a Link tag within the
Head section gets resolved before being combined with its content page so
"style.css" should work in your case (also link tags within conditional
comments - thanks Steven). I've just read "ASP.Net 2.0 - Master Pages:
Tips, Tricks, and Traps" by K. Scott Allen
(http://odetocode.com/Articles/450.aspx) which is a great article on the
subject.

Hope that helps.

Best regards

John
 
L

Leon Mayne

Lance Wynn said:
Hello all,
Is there a way to use the ~/ path to link a CSS page?

I thought maybe something like this would work, but no go:
<link href="~/style.css" rel="stylesheet" type="text/css"/>

Is this possible to do with the link element?

Adding runat="server" should do it:
<link href="~/style.css" rel="stylesheet" type="text/css" runat="server" />
 
H

Hans Kesting

marss brought next idea :
If you use href="/style.css" it refers to a stylesheet resided in the
root folder of an application
disregarding of position of the parent page in a website hierarchy.
IMHO, no need to convert the stylesheet link to a server control, a
leading slash "/" for HTML elements do the same as "~/" for web/HTML
controls.

Regards,
Mykola
http://marss.co.ua - Casual ideas for web development

That will work for a production server where the root of the
application is http://www.company.com.
It will fail on your development box where you want to use
http://localhost/CompanyDevSite

The ~ syntax (when used correctly) will work in both cases.

Hans Kesting
 
P

Patrice

Another option is to place the stylesheet in the site theme folder. It will
be then automatically referenced from your pages...
 
T

Tahir

hi,

here is some code from my MasterPage:
......
<body>
<form id="form1" runat="server">

<div id="main-header" class="box">
<img src="Tema/banner.bmp" alt=""/>
......

i have a "Tema" folder at root directory containing MasterPage and
banner.bmp.
* when i use this code, VS indicates that banner file is missing but at
debug time web browser shows the image, the result is ok.
* when i write there ="~/Tema/banner.bmp", VS says ok but browser says image
missing where it shows the address "localhost/website/~/Tema/banner.bmp"
* when i show the image by vs gui, the code apperas as
src="../Tema/banner.bmp", image is still missing and browser shows the
address "localhost/Tema/banner.bmp"

can anybody who understands the "~" operator, describes this?
 
M

Mark Rae [MVP]

can anybody who understands the "~" operator, describes this?

The tilde (~) is server-side notation, not client-side notation...

That is why something like: <img src="~/Tema/banner.bmp" alt=""/> can never
work...

However, <img src="~/Tema/banner.bmp" alt="" runat="server" /> will work...
 
M

Milosz Skalecki [MCAD]

Howdy,

Workaround 4:
<link href="<%=ResolveClientUrl("~/Css/style.css") %>" type="text/css" />
ResolveClientUrl method is invented for such purposes.
--
Milosz


Jialiang Ge said:
Hello,

From your post, my understanding on this issue is: you wonder how to
resolve the root directory when we link to a style sheet. If I'm off base,
please feel free to let me know.

According to the MSDN article: ASP.NET Web Site Paths
http://msdn2.microsoft.com/en-us/library/ms178116.aspx
"ASP.NET includes the Web application root operator (~), which you can use
when specifying a path in *server controls*. ASP.NET resolves the ~
operator to the root of the current application. You can use the ~ operator
in conjunction with folders to specify a path that is based on the current
root."
Therefore, as Cowboy replied, the link is not attached to a server control,
and the operator '~' cannot be resolved as expected.

Here are two workarounds for your reference:

Workaround 1: Declare 'runat=server' for the <head> element, and use '~'
inside it. For instance,
<head runat="server">
<title>Untitled Page</title>
<link href="~/Css/style.css" rel="stylesheet" type="text/css" />
</head>

Workaround 2:
We can link to the style sheet with some server side codes
(quoted from
http://www.pluralsight.com/blogs/ted/archive/2005/08/31/14437.aspx)
public static void AddLinkedStyleSheet(Page page, string stylesheet)
{
HtmlLink link = new HtmlLink();
link.Href = page.ResolveUrl(stylesheet);
link1.Attributes["text"] = "text/css";
link1.Attributes["rel"] = "stylesheet";

page.Header.Controls.Add(link);
}
MyClass.AddLinkedStyleSheet(this, "~/css/my.css");

Please let me know if you have any other concerns, or need anything else.

Regards,
Jialiang Ge ([email protected], remove 'online.')
Microsoft Online Community Support

==================================================
For MSDN subscribers whose posts are left unanswered, please check this
document: http://blogs.msdn.com/msdnts/pages/postingAlias.aspx

Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/subscriptions/managednewsgroups/default.aspx#notif
ications. If you are using Outlook Express/Windows Mail, please make sure
you clear the check box "Tools/Options/Read: Get 300 headers at a time" to
see your reply promptly.

Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump analysis issues. Issues of this nature are best
handled working with a dedicated Microsoft Support Engineer by contacting
Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/subscriptions/support/default.aspx.
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
 
J

Jialiang Ge [MSFT]

Hello,

Would you mind letting me know the result of the suggestions? If you need
further assistance, feel free to let me know. I will be more than happy to
be of assistance.

Have a great day!

Regards,
Jialiang Ge ([email protected], remove 'online.')
Microsoft Online Community Support

=================================================
When responding to posts, please "Reply to Group" via your newsreader
so that others may learn and benefit from your issue.
=================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
 
L

Lance Wynn

Sorry it took so long to get back to you, My wife went into labor, and I've
been at the hospital until today. (Healthy boy, 11 lbs 13 oz aprox 5.3
kilos, he is huge ;-)

I was able to get it working using the runat=server in the <head> tag, I
have not been able to try any of the other suggestions, but I certainly
learned a lot more about ASP.net through this.

Thanks alot,
Lance
 
J

Jialiang Ge [MSFT]

Hello Lance,

I'm very pleased to hear the good news. Congratulations! : )

Regards,
Jialiang Ge ([email protected], remove 'online.')
Microsoft Online Community Support

=================================================
When responding to posts, please "Reply to Group" via your newsreader
so that others may learn and benefit from your issue.
=================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
 
G

G.Lindqvist

Sorry it took so long to get back to you, My wife went into labor, and I've
been at the hospital until today.  (Healthy boy, 11 lbs 13 oz aprox 5.3
kilos, he is huge ;-)

I was able to get it working using the runat=server in the <head> tag, I
have not been able to try any of the other suggestions, but I certainly
learned a lot more about ASP.net through this.

Thanks alot,
Lance









- Show quoted text -

That solution should work. If you don't wan't runat on the head tag
you could add only "runat" on the link tag.

This should also work, I think.

<head>
<link id="Link1" href="~/Content/main.css" rel="stylesheet"
type="text/css" runat="server" />


Regards,
Gustaf Lindqvist
 
L

Lance Wynn

I thought this should work too, but it didn't. Apparently the link tag
doesn't accept the runat=server parameter


That solution should work. If you don't wan't runat on the head tag
you could add only "runat" on the link tag.

This should also work, I think.

<head>
<link id="Link1" href="~/Content/main.css" rel="stylesheet"
type="text/css" runat="server" />


Regards,
Gustaf Lindqvist
 
L

Lance Wynn

Thanks Patrice,
I started studying about themes, skins, and dynamically setting the master
page, and I am really liking where things are going. I think this will solve
a lot of my ills.

Thanks again for the helpful nudge!
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,769
Messages
2,569,578
Members
45,052
Latest member
LucyCarper

Latest Threads

Top