Using C# variables in CSS

Question

I'm working on a website using ASP.NET C# code, the website will be used for a variety of websites and only serve as a 'placeholder'. We would love to have CSS code which can have different markup depending on which website you are visiting. We're pulling information about the website someone is visiting from our database, which has some methods attached to return these values.

The problem is that we want to be able to use these values in CSS code, and currently the only way I can think of doing this is by using inline CSS code instead of .css files. Which would make our code look something like:

<style>
    .navbar {
        background-color: @Website.Models.WebsiteConfiguration.NavbarColor;
    }
</style>

Which isn't ideal. Is there another way of using C# variables in CSS code, without using inline code? I've found a website which describes using a custom handler to modify the css files, however we couldn't get this to work because our parser was never called. We also found the .LESS library, but we would rather not use this library, and instead work on a solution that only uses a couple lines of code.

the only other way (other than less/some other precompiler), would be to set it in js, but again it wouldn't be perfect. I'm not certain, but you might be able to use [**attr**](https://developer.mozilla.org/en/docs/Web/CSS/attr)? — jbutler483, Jan 20 '15 at 10:49
Have you considered loading different CSS files based on which website you are on? — Andy, Jan 20 '15 at 10:50
@Andy that is not entirely possible, because of the nature of the project, unfortunately. — Kevin, Jan 20 '15 at 10:51
@jbutlet483 The idea of using `attr` would maybe do it, I'll test around with that for sure. But feel free to weight in on the topic with different ideas :-) — Kevin, Jan 20 '15 at 10:53
@KevinVoorn I would then suggest [this solution](http://stackoverflow.com/a/6985215/1355856) using an `.ashx` handler to build up the CSS file in code and output with a CSS content type, whether it will work for you I don't know but I have used it on a couple of my projects and it has worked well. — Andy, Jan 20 '15 at 10:55
@Andy That looks like a better solution then inline css code, I will also be taking a look at that answer, thanks! — Kevin, Jan 20 '15 at 10:57
possible duplicate of [Dynamic Stylesheets Using Razor](http://stackoverflow.com/questions/10279873/dynamic-stylesheets-using-razor) — Uwe Keim, Jan 20 '15 at 13:42

Fermin · Accepted Answer · 2016-03-16T14:50:29.637

You could use some sort of templating language to render the css files. On it's own variables in css won't be populated but you could write a utility class to read the template file, populate variables, save new file to appropriate location and output the correct style element on the page, pointing to new css file.

That way you could have something like the following that would render the appropriate css:

<% CssHelper.Load("myFile.template", "websitex/style.css")%>

Would that be a viable option?

Using C# variables in CSS

1 Answers1