-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Compass Core: Layout Module
avit edited this page Sep 13, 2010
·
5 revisions
The Layout Module provides helpers for general layout solutions that aren’t specifically provided by one of the framework modules. Include the layout module with:
@import compass/layout.sass
The layout module does not generate any CSS, it only provides mixins.
This will pin your layout’s footer to the bottom of the screen when page content is too short. The footer will scroll normally when the page content fills the height of the window.
- A fixed footer height (px)
- A container element for the page content, with a “clearing element” as its last child.
- A footer element as a direct child of <body>.
Mix into the top level:
+sticky-footer( 180px, “#root”, “#root_footer”, “#footer” )
You can specify the selectors for the three required elements. The default selectors are as shown above, but they can be changed using the last three optional parameters. The height is the only required parameter.
The markup follows this structure:
body
#root
#header
Page content goes here.
#root_footer
#footer
Footer content goes here.