Why can't I get the LESS CSS framework working here?

Question

http://jsfiddle.net/xfCE8/3/

I've been trying to get less CSS to work, but with no luck, which is pretty embarrassing seeing as how nobody else has this problem.

Answer 1

It might be that the "Manage Resources" loader does not understand what content it should be when the extension on the css is ".less" and not ".css".

I think jsfiddle ignores the references you have in the HTML section: all external references must be added on the left side in either the list of known frameworks, or as a link in the "Manage Resources" section. I would guess this is for security reasons...

Answer 2

I don't think you can link to the .less file directly from the googlecode site. If I run your jsfiddle with Firebug open I see an error. If I look at the HTTP request made to load the .less file I see the following:

Response Headers
Content-Length  28464
Content-Type    text/x-c; charset=us-ascii
Content-Disposition attachment; filename="style.less"
Accept-Ranges   bytes
Date    Mon, 13 Dec 2010 09:11:05 GMT
Last-Modified   Mon, 13 Dec 2010 09:01:31 GMT
Expires Mon, 20 Dec 2010 09:11:05 GMT
Server  DFE/largefile
Cache-Control   public, max-age=604800
Age 452

The Content-Disposition triggers the browser to prompt to save the file if you visit the URL directly. I think it is also confusing the code which attempts to download the .less file.

Try downloading the file and placing it on a different server which doesn't have any special handling for the .less mimetype...

Answer 3

First, in chrome, the js and css makes error and can't be loaded. So you must host them yourself on your server and I advise you to rename the .less to .css if you don't have access to your apache ini or if you don't know .htaccess.

Second thing, I can't find @brand-color but @brand_color which is different ;) The whole css seems to be different anyway here.

Finally, this css framework doesn't seem to be nice to start with (a lot of test comments, etc... doesn't seem finished to me and I'd use it with caution.)

Answer 4

Don't know this framework, but I can see that you have an s too much here:

<link rel="stylesheet/less" href="http://lesscsss.googlecode.com/files/style.less" type="text/css" />

it should be

<link rel="stylesheet/less" href="http://lesscss.googlecode.com/files/style.less" type="text/css" />

EDIT: Sorry, was wrong. The two links in your code are diffirent, but they should be. The first one links to lesscss, the second one to lesscsss, and both are right. I am sorry.