Tip: CSS3Pie and ASP.NET Relative Linking
First off I’d like to say that I’m loving CSS3 Pie and am currently finding ways to incorporate it into a lot of projects… it’s an excellent contribution to the community and is leaps and bounds beyond the other solutions out there.
The only major issue I've had with it is a limitation in IE dealing with loading HTC files being relative to the page being viewed as opposed to being relative to the CSS file. Using a static absolute URL within your domain works just fine, but that also can can issues when using URLs that could change, such as moving from a dev server to a production server, etc, as the extra time is needed to go into your CSS and change your URLs... hence the code is no longer an exact match to the build on your dev server if that's a feature you need.
I ended up deciding that header redirection from something like mod.rewrite would be the best solution, as you could include a string in your URL that would always trigger a 301 redirect... mod rewrite for Apache or the Rewrite module for IIS could handle this, but since I try to look at solutions that are within my framework code and don't require outside configuration, I came up with a solution that is easy to implement for anyone using ASP.NET.
(Please, no spam or flames for using Microsoft tech, I used to be a php-only guy, but I've moved over to the MS platform recently as I've had a few clients demand it and I'm pretty happy with the results... not to mention you can do quite a hell of a bit with their free tool offering ala Web Express)
For starters, in any of your linked CSS Stylesheets, you'd use the following:
Code:
.thisstyle
{
-pie-background: linear-gradient(#ff0000, #0000ff);
behavior: url("CSS3PIE.aspx"); /* .aspx extension forces IIS to handoff to the ASP.NET Processor */
}
Then, you need to add an entry to your Global.asax file:
Code:
protected void Application_BeginRequest(Object sender, EventArgs e)
{
string inboundURL = (Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Authority + HttpContext.Current.Request.Url.AbsolutePath);
// Add Response Redirection for requests to the PIE htc behavior for CSS3 Support in IE below 9
if (Regex.IsMatch(inboundURL, "CSS3PIE"))
{
Response.Clear();
Response.Status = "301 Moved Permanently";
// The path entered here should be the App-relative path to the PIE HTC Behavior.
// We've forced it to all lowercase because I'm also forcing all lowercase urls in my application
// via 301 redirects so if you do the same it won't cause multiple redirects
string appRelativePath = "~/Content/PIE.htc";
string path = VirtualPathUtility.ToAbsolute(appRelativePath.ToLower());
Response.AddHeader("Location", path);
Response.End();
}
}
Many web servers running IIS check for the existence of a URL and return a 404 response automatically without handing off processing to the ASP.NET engine. To test if your server is configured this way, you can add the code to your Global.asax file, compile and deploy, and then visit
http://yourdomain/yourapp/randomurl/CSS3PIEIf it returns a 404 error, then IIS is checking for file existence ahead of time. This won’t be an issue on any servers already configured for ASP.NET MVC. If you get the 404 error from IIS, then you can add an empty CSS3PIE.aspx file to any directories which house aspx pages viewable that require this behavior.
Hopefully this help out other CSS3PIE users running ASP.NET!
Forums
