Using Susy Grids, how do you force the container to be min-height 100% and footer to be at the bottom of the page.
html
<div class="page">
<header id="header-container">header</header>
<section ="main-container">
some short content
</section>
<footer id="footer-container">footer</footer>
</div>
css/scss
$total-columns : 16;
$column-width : 4.5%;
$gutter-width : 1%;
$grid-padding : 6.5%;
$legacy-support-for-ie6 : false;
.page { @include container;}
#main-container{@include span-columns($total-columns omega);}
#footer-container{
@include clearfix;
@include reset-columns;
min-height:100px;}
这对于Compass Sticky Footer mixin可能是一项工作。
I might be wrong - but susy usually deals with width or horizontal based positioning problems (the Y of xy positioning) - height and vertical positioning is not something susy worries about.
Again, I might be wrong - but I think you're looking to the wrong tool for this - Plus, you can always just write normal css to achieve what you're trying to do.
Tools like this are great, but it's a good thing to keep in mind that in the end you're really just getting CSS - so if you're not sure how to use CSS to accomplish something maybe you shouldn't be using tools to write that CSS for you. I always make sure the tools I'm using produces the CSS that I want it to, if it's not - I don't use that tool.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.