Why doesn't LESS override a property declared in two selectors?

Question

Here is the code (test.less):

body {
    padding: 50px;
}

body {
    padding: 20px;
}

Why, after compiling into CSS, I have this:

body {
  padding: 50px;
}
body {
  padding: 20px;
}

I thought LESS would override the body class, and in CSS I would only have one body class.

Is there any way to do this?

+5

user0103 Feb 25 '13 at 10:08

1 answer

Manuel Ebert · Accepted Answer · 2013-02-26T01:42:03+0000

Less than ever, it doesn't work with CSS. It does this to rewrite nested blocks, e.g.

body {
  padding: 50px;
  h1 {
    color: blue;
  }
}

at

body {
  padding: 50px;
}
body h1 {
  color: blue;
}

, LESS, CSS, , , , specificity (. , ), , , .