footer 固定到底部

#container {
                /*保证footer是相对于container位置绝对定位*/
                position: relative;
                width: 100%;
                min-height: 100%;
                /*设置padding-bottom值大于等于footer的height值，以保证main的内容能够全部显示出来而不被footer遮盖；*/
                padding-bottom: 100px;
                box-sizing: border-box;
                height: auto;
            }
            
            .header {
                width: 100%;
                height: 200px;
                background: #999;
            }
            
            .main {
                width: 100%;
                height: auto;
                background: pink;
            }
            
            .footer {
                width: 100%;
                height: 100px;
                /* footer的高度一定要是固定值*/
                position: absolute;
                left: 0;
                bottom: 0;
                background: #333;
            }