Skip to content

Instantly share code, notes, and snippets.

@sutter
Created July 15, 2013 14:03
Show Gist options
  • Save sutter/6000170 to your computer and use it in GitHub Desktop.
Save sutter/6000170 to your computer and use it in GitHub Desktop.
fluid grid
.wrapper {
max-width: 940px;
min-width: 768px;
margin-left: auto;
margin-right: auto;
}
.row {
margin-left: -2.12766%;
}
[class*=col-] {
float: left;
margin-left: 2.12766%;
}
/* Column */
.col-1 {
width: 6.20567%;
}
.col-2 {
width: 14.53901%;
}
.col-3 {
width: 22.87234%;
}
.col-4 {
width: 31.20567%;
}
.col-5 {
width: 39.53901%;
}
.col-6 {
width: 47.87234%;
}
.col-7 {
width: 56.20567%;
}
.col-8 {
width: 64.53901%;
}
.col-9 {
width: 72.87234%;
}
.col-10 {
width: 81.20567%;
}
.col-11 {
width: 89.53901%;
}
.col-12 {
width: 97.87234%;
}
/* Push left column */
.offset-col-1 {
margin-left: 10.46099%;
}
.offset-col-2 {
margin-left: 18.79433%;
}
.offset-col-3 {
margin-left: 27.12766%;
}
.offset-col-4 {
margin-left: 35.46099%;
}
.offset-col-5 {
margin-left: 43.79433%;
}
.offset-col-6 {
margin-left: 52.12766%;
}
.offset-col-7 {
margin-left: 60.46099%;
}
.offset-col-8 {
margin-left: 68.79433%;
}
.offset-col-9 {
margin-left: 77.12766%;
}
.offset-col-10 {
margin-left: 85.46099%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment