Eric Douglas ericdouglas
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
| .container | |
| .column | |
| // Your Content | |
| //- end of .column | |
| //- end of .container |
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
| <div class="container"> | |
| <div class="row clearfix"> | |
| <div class="column half"> | |
| <!-- Your Content--> | |
| </div> | |
| <div class="column half"> | |
| <!-- Your Content--> | |
| </div> | |
| </div> | |
| </div> |
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
| .container | |
| .row.clearfix | |
| .column.half | |
| // Your Content | |
| .column.half | |
| // Your Content | |
| //- end of .row.clearfix | |
| //- end of .container |
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
| @media (min-width: 40rem) { | |
| .column { | |
| float: left; | |
| padding-left: 1rem; | |
| padding-right: 1rem; | |
| } | |
| .column.full { | |
| width: 100%; | |
| } | |
| .column.two-thirds { |
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
| @media (min-width: 40rem) | |
| .column | |
| float left | |
| margin 0 | |
| padding-left 1rem | |
| padding-right 1rem | |
| .column.full | |
| width 100% | |
| .column.two-thirds |
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
| <div class="container"> | |
| <div class="row clearfix"> | |
| <div class="column half"> | |
| <!-- Your Content--> | |
| </div> | |
| <div class="column half"> | |
| <!-- Your Content--> | |
| </div> | |
| </div> | |
| <div class="row clearfix"> |
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
| .container | |
| .row.clearfix | |
| .column.half | |
| // Your Content | |
| .column.half | |
| // Your Content | |
| //- end of .row.clearfix | |
| .row.clearfix | |
| .column.half |
ericdouglas
/ gist:9092737
Created
February 19, 2014 14:04
Clearfix (Made by Nicolas Gallagher) - CSS
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
| .clearfix:before, | |
| .clearfix:after { | |
| content: ' '; | |
| display: table; | |
| } | |
| .clearfix:after { | |
| clear: both; | |
| } | |
| .clearfix { | |
| *zoom: 1; |
ericdouglas
/ gist:9092738
Created
February 19, 2014 14:05
Clearfix (Made by Nicolas Gallagher) - Stylus
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
| .clearfix:before, | |
| .clearfix:after | |
| content ' ' | |
| display table | |
| .clearfix:after | |
| clear both | |
| .clearfix | |
| *zoom 1 |
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
| .container | |
| .row.clearfix | |
| .column.half.flow-opposite | |
| // Your Content | |
| .column.half | |
| // Your Content | |
| //- end of .row.clearfix | |
| //- end of .container |