Fluid sticky footer with flex

前端 未结 2 704
暖寄归人
暖寄归人 2021-01-23 22:50

I am trying to make footer at the bootom with flex as described in this question How to make a fluid sticky footer

the answer with adding to the body

bo         


        
2条回答
  •  半阙折子戏
    2021-01-23 23:51

    Try using a flex container on the #mainDiv with justify-content: space-between.

    body {
      display: flex;
      flex-direction: column;
      min-height: 100vh;
      background-color: orange;
      margin: 0;
    }
    
    #mainDiv {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
    
      
    This is header
    This is content
    This is footer

提交回复
热议问题