A set of useful mixins for LESS CSS | Hacker News Reader

A set of useful mixins for LESS CSS

lesselements.com

61 pointsllambda11 comments

fadeyev, your first example is a little misleading. Only Safari 3-4 required the border-radius syntax to be declared individually. So really this is how it goes:

     /* these two lines for saf 3-4 support */
       -webkit-border-top-left-radius: 5px; 
      -webkit-border-top-right-radius: 5px;

    /* all you need for Saf5, Chrome, Op, FF1+, IE9 */
     -moz-border-radius: 5px 5px 0 0;
          border-radius: 5px 5px 0 0;

That said, I like the project. Just clarifying this. :)

EDIT: given the spec'd shorthand syntax, your shorthand for unique corners seems to conflict `(5px, 0, 0, 5px)`. I'd suggest changing that.

Thanks for pointing this out, you're right that the example is now outdated, though it's probably not too difficult to find more browser specific code to pick on :) I'll change that.

Suggestion to improve the article: Give a visual example of each mixin. Otherwise, thanks for the article!

are there any popular mixins for sass?

Check out http://compass-style.org/reference/compass/ . It has everything the two others have + some more.

Unfortunately many of the compass mixins require extensions to SASS to work. This makes them difficult to use without using all of compass.

https://github.com/thoughtbot/bourbon

I would add a page on the site to view the source for the mixins.

Eh.

What was wrong with Preboot[1]?

[1]: http://markdotto.com/bootstrap/

Hey aditya42,

I'm the creator of LESS Elements. Nothing is wrong with Bootstrap, it's just that when I wrote these mixins a while back Bootstrap wasn't yet available.

GitHub repo?

Reply on news.ycombinator.com