フレックスボックスコンテナをページのサイズ変更後にフッターにプルできません

Question

ページネストされたコンテンツボックスのサイズを変更した後、メインのdivを降りて分割します。

それはとても似ています：ここで

ライブexample（Chromeのみのコンテンツ積み込み作業）です。

.Central { 
     display: flex; 
     flex-direction: row; 
     flex-grow: 1; 
     height: auto; 
    } 
    .LeftSide { 
     background-color: #ddd0d1; 
     flex-grow: 8; 

    } 
    .RightSide{ 
     background-color: #965254; 
     flex-grow: 1; 
    } 

Answer 1

代わりのheight: 100vh、min-height: 100vhを使用します。ここでは、問題を表示するための応答（私が考えるほど）の部分があることjsfiddle

CSSコードです。

.MainContainer { 
    background-color: #fee9ea; 
    margin-left: 0%; 
    margin-right: 0%; 
    /* height: 100vh; <-- remove fixed height */ 
    min-height: 100vh; /* new */ 
    box-sizing: border-box; 
    display: flex; 
    flex-direction: column; 
} 

コンテンツを展開するためにメインコンテナが解放されます。

あなたが一定の高さを好む場合は、height: 100vhを維持し、垂直方向のスクロールを追加します。

.LeftSide { 
    background-color: #ddd0d1; 
    flex-grow: 8; 
    overflow: auto; /* new */ 
}