2015-10-31 54 views
1

根据我下面的内容,如果我的主要内容没有足够的内容,是否有人可以帮助我将页脚留在浏览器窗口的底部。我不想要一个粘性的页脚。有一个角度的材料方式,但我找不到它。角材料:强制页脚底部

谢谢!

<body layout="column" > 
    <md-toolbar > 
    </md-toolbar> 

    <div layout="row" flex> 
    <md-sidenav class="md-sidenav-left md-whiteframe-z2 " flex > 
    </md-sidenav> 

    <md-content flex layout="row" layout-align="center start"> 
     <div style="max-width: 1600px;" flex layout="column" layout-fill > 
     <div > 
      this is the main content 
     </div> 
     <div > 
      this is the footer 
     </div> 
     </div> 
    </md-content> 
    </div> 
</body> 

这里是jsfiddle

+0

请提供jsfiddle。 – Alex

+1

@alirezasafian - 更新的问题链接到jsfiddle。感谢您的期待 –

回答

1

我希望this可以帮助你。我为你的html添加了一些类并应用了这些规则。

.wrapper, 
div[layout=row] 
{ 
    height: 100%; 
} 

div[layout=column] 
{ 
     display: flex; 
    min-height: 100vh; 
    flex-direction: column; 
} 
.content 
{ 
    flex: 1; 
}