I've been studying compass and while it is a fun thing to play with and use, one thing bothers me(besides being unable to add padding as it wrecks the grid), how do I nest columns?
I want to be able to do what blueprint does: nest containers like say, I have a 24-column page divided in two(17 and 7 columns). In the right part of that page(the one with 7 columns), I want to divided some elements into two(2 and 5 columns).
I tried this:
#main
+container
#main-content
+column(17)
+box-padding(17, 10px)
:margin
:right 0
#sidebar
+column(7, true)
+box-padding(7, 10px)
That's the code for the main page. The sidebar contains a list with some labels and input fields
li
+container
:margin
:bottom 5px
label
+column(2)
:margin
:right 0
input
+column(5, true)
It kinda works, but inspecting the li in firebug shows that it's width is actually 950px as opposed to be just 270px since it is just 7 columns. I tried googling about nested columns but I can't seem to find any example in compass. I've also tried the wiki and the documentation to no avail.
