LESS - structuring the document - less

Question

i started using LESS to have a simple tool for creating .css files.
My question is, what is the most common way to handle such css class-construct:
<div id="wrapper">
<div id="left">
<h2>Left</h2>
</div>
<div id="right">
<h2>Right</h2>
</div>
</div>
The boxes #left and #right have exactly the same stylesheet, the h2 in each box should be different.
I would have solved it with this code:
#wrapper {
#left, #right {
width:50%;
float:left;
}
#left h2 {
color:black;
}
#right h2 {
color:red;
}
}
or you can solve it like this:
.left_right {
width:50%;
float:left;
}
#wrapper {
#left {
.left_right;
h2 {
color:black;
}
}
#right {
.left_right
h2 {
color:red;
}
}
}
What is the 'right' way or is it just a personal choice...
P.S: And is there any way to get highlighting in CODA for .less files?
Thanks

Answer 1

Personal preference for sure. The first example, for me, is easier to read and should result in less CSS, which is the purpose of LESS after all!
As for syntax highlighting in CODA, I don't use it myself, or have access to a Mac right now, but a quick Google search turned up a few results.
Instructions for one way can be found here: http://christophercasper.com/2010/09/less-syntax-highlighting-in-coda/
I also found a that there was a plugin for CODA, but it's now been turned into it's own app. Not sure how useful it is, but you can find it here: http://incident57.com/less/