Created
June 21, 2010 03:34
-
-
Save lessallan/446358 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
=lesscolumns($width_of_page :960px, $number_of_columns :4, $column_padding :10px, $width_of_gutter :10px, $border_width :0px, $border_style :solid, $border_color :#333) | |
$number_of_gutters: $number_of_columns - 1 | |
$width_of_column: ($width_of_page - ($width_of_gutter * $number_of_gutters)) / $number_of_columns - ($column_padding * 2) - ($border_width * 2) | |
width: $width_of_page | |
+pie-clearfix | |
> * | |
width: $width_of_column | |
margin-left: $width_of_gutter | |
padding: $column_padding | |
border: $border_width $border_style $border_color | |
float: left | |
&:first-child | |
margin-left: 0px | |
#test | |
+lesscolumns(962px, 4, 10px, 10px, 1px, dotted, #333) | |
Also my modern browsers are able to handle decimal pixels so we don't have a rounding issue with modern browsers.
columns inside of columns isn't great
The code needs to some how realize it nested inside of another lesscolumn and feed the column_width of the parent into the page_width of the second set of columns.
enumerate a class on the children?
I don't like having to set a page width
Which would you prefer? Having to set the container width or the width of the columns? You could start the math from either perspective.
looks like ie doesn't support :last-child
IE supports :first-child (mostly)
IE8 doesn't
Sure it does. IE has better :first-child support than :last-child, for whatever reason.
John wins!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I don't like having to set a page width