Correct way to import Blueprint's ie.css via DotLess in a Spark view
- by Chris F
I am using the Spark View Engine for ASP.NET MVC2 and trying to use Blueprint CSS. The quick guide to Blueprint says to add links to the css files like so:
<link rel="stylesheet" href="blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="blueprint/print.css" type="text/css" media="print">
<!--[if lt IE 8]><link rel="stylesheet" href="blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
But I'm using DotLess and wish to simplify Blueprint as suggested here. So I'm doing this in my site.less (which gets compiled to site.min.css by Chirpy):
@import "screen.css";
#header { #title { .span-10; .column; } } ...
Now my site can just reference site.min.css and it includes blueprint's screen.css, which includes my reset. I can also tack on an @import "print.css" after my @import "screen.css" if desired. But now, I'm trying to figure out the best way to bring in the ie.css file to have Blueprint render correctly in IE6 & IE7.
In my Spark setup, I have a partial called _Styles.spark that is brought into the Application.spark and is passed a view model that includes the filenames for all stylesheets to include (and an HtmlExtension to get the full path) and they're added using an "each" iterator.
<link each="var styleSheet in Model.Styles" href="${Html.Stylesheet(styleSheet)}" rel="stylesheet" type="text/css" media="all"/>
Should I simply put this below the above line in my _Styles.spark file?
<!--[if lt IE 8]><link rel="stylesheet" href="${Html.Stylesheet("ie.css")}" type="text/css" media="screen, projection"><![endif]-->
Will Spark even process it because it's surrounded by a comment?
