FRIHOST • FORUMS • SEARCH • FAQ • TOS • BLOGS • DIRECTORY
You are invited to Log in or Register a Frihost Account!

LessCSS

   Frihost Forum Index -> Scripting -> Html, CSS and Javascript
 


InsanePL
Anyone tried this ?

http://lesscss.org/

Looks pretty cool, and could be easy to learn
riccopt
sounds interesting buy it seems pretty useless to me...
if you are going to use the same attributes of another class why should you create another class at all?
snowboardalliance
riccopt wrote:
sounds interesting buy it seems pretty useless to me...
if you are going to use the same attributes of another class why should you create another class at all?


It could be useful in a few ways. Variables seem like a plus so you can change common colors in one place like the example. Operations sound even cooler.

As for your question, I'm not sure but I'm guessing you're talking about mixins. The example on the site makes since. For example, a lot of people make tons of classes in css and apply them to different things in html, some elements having multiple classes. This separates the css and html more by allowing you to apply the classes to ids (or other things). Example of messier css:

Code:

.big { ...}
.important { ...}
.floatleft {...}
.clearfloat {...}

Code:

<html>
...
<div class="big important"></div>
<div class="floatleft"></div>
<div class="clearfloat></div>
</html>


If you could remove those classes from html, it would be cleaner.

I'm almost considering trying one of these server side css programs, but I'm not sure if I will since it's something new to learn and it's dependent on the software I choose whereas css is a standard.
InsanePL
Just think about it, You have a lot of same color in your stylesheet like #F0F0F0 And You want to change this color to #F1F1F1, instead of changing all variables, you can add class @color_links and just change the value,. then all colors will be changed, Or the example of rounnded corners witz -moz etc. You don`t have to repeat all the time this, You can set it at the beggining
AftershockVibe
Yes, but if you do that then you've broken the model that CSS was designed to fit into.

CSS was supposed to separate appearance from content (HTML). If you add things like this in then it's becoming more like a programming language, rather than simply defining the appearance of a page.

Furthermore, if you really want to do something like this then you can already use PHP, ASP or similar to generate the style sheet.
rockacola
InsanePL wrote:
Just think about it, You have a lot of same color in your stylesheet like #F0F0F0 And You want to change this color to #F1F1F1, instead of changing all variables, you can add class @color_links and just change the value,. then all colors will be changed, Or the example of rounnded corners witz -moz etc. You don`t have to repeat all the time this, You can set it at the beggining


That's pretty much turning CSS into a semi-script language.
The reason I enjoy CSS is because CSS focus on one thing and one thing only: styling. no calculation, no variable, no if statements...

Quick search on google, I found many examples of how to convert your CSS 2.1 to what it is not:
http://www.conditional-css.com/advanced
http://disruptive-innovations.com/zoo/cssvariables/
http://icant.co.uk/articles/cssconstants/
Crying or Very sad
imagefree
its funtastic. I never knew that CSS can be written this way.
Doesnt it create problems on old browsers (specially IE6 and other IEs)?
TomS
imagefree wrote:
its funtastic. I never knew that CSS can be written this way.
Doesnt it create problems on old browsers (specially IE6 and other IEs)?


Nope. Because the CSS stays the same. LessCSS is just a "precompiler". You write your LesCSS-Code, then send it to the script and it transforms it into real CSS.

CSS can't be written that way. LessCSS is another lanuage, that looks like CSS and behaves like CSS most of the time. But no Browser on earth can interpret the code. It has to be translated to real CSS first.
sonam
Quote:
Doesnt it create problems on old browsers (specially IE6 and other IEs)?

CSS never create problems in any browser only browsers have different interpretations of CSS. In most situation the problem in IE (especialy =< IE6) are default CSS statements of building HTML and reading CSS (margins, visibility. etc.).

Sonam
snowboardalliance
AftershockVibe wrote:
Yes, but if you do that then you've broken the model that CSS was designed to fit into.

CSS was supposed to separate appearance from content (HTML). If you add things like this in then it's becoming more like a programming language, rather than simply defining the appearance of a page.

Furthermore, if you really want to do something like this then you can already use PHP, ASP or similar to generate the style sheet.


I don't know that's like saying php breaks html by making it more than displaying text.

This isn't like meant to replace css, just a way to generate repeated things easier. I'd hardly call it a programming language, maybe scripting language would be more appropriate.

And yes, you could do this with PHP or ASP, this method uses Ruby on Rails but there are other frameworks for other languages. The point is, this makes it so you can write simple scripts that are like css and then have the server side script create the normal css for you. It's exactly what you are saying.
Hogwarts
Personally, I dislike this idea. You shouldn't be repeating CSS in the way they're doing, either. It really is rather stupid.

So, copying their example.
Code:
/* CSS */

#header {
  color: #4D926F;
}

h2 {
  color: #4D926F;
}

which they change to
Code:
/* LESS */

@brand_color: #4D926F;

#header {
  color: @brand_color;
}

h2 {
  color: @brand_color;
}

At the risk of sounding intelligent, why can't you just do
Code:
/* LEAST */

#header, h2 {
  color: #4D926F;
}

The only thing I could see use in a CSS 'precompiler' (as somebody called it) for is if you're setting the colour variables within your administration panel, or something like that (which is still stupid, but some people may like to do it. Perhaps if it was to make a site like Freewebs, giving users a stock template and allowing them to pick the colours) (actually, it would be also something you would do if you wanted to have a hue/saturation editor for the end-user on your template instead of the ol' pick-a-colour-theme-buttons, although that could also be better done with JavaScript)
sonam
Hogwarts wrote:

At the risk of sounding intelligent, why can't you just do
Code:
/* LEAST */

#header, h2 {
  color: #4D926F;
}



I am absolutely agree with Hogwarts. Using one definition for different tags, id's and class are (for me) better and simplest solution then less css.

Sonam
adri
It works when you have 1 style like your example:

Code:
#header, h2 {
  color: #4D926F;
}


But when you want h2 to have text-decoration (underline) and you don't want that with your #header than you still need seperate tags aka:

Code:
#header {text-decoration: none;}

h2 {text-decoration: underline;}

#header, h2 { color: #4D926F;}


But I still think that LessCSS is useless.

Adri Smile
Hogwarts
adri wrote:
It works when you have 1 style like your example:

Code:
#header, h2 {
  color: #4D926F;
}


But when you want h2 to have text-decoration (underline) and you don't want that with your #header than you still need seperate tags aka:

Code:
#header {text-decoration: none;}

h2 {text-decoration: underline;}

#header, h2 { color: #4D926F;}


But I still think that LessCSS is useless.

Adri Smile

Of course, the MessCSS way of doing that would be

Code:
@foobar= #ffffff; (or however it sets this)

#header { text decoration: none; color: @foobar; }
#h2 { text-decoration: underline; color: @foobar; }


which is .. absolutely no improvement whatsoever (in fact, it's around 20 characters longer!) Shocked
Related topics
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.