[HTML] 인 flexbox 채우기 가능한 공간을 수직으로

인 flexbox 채우기 가능한 공간을 수직으로

해결법

1. ---

   1.그래서 당신이 시도 할 수 있습니다 :

   그래서 당신이 시도 할 수 있습니다 :

   어디 인 flexbox 스팬 뷰포트의 높이 아래 데모를 참조하십시오 :

   신체 { 여백 : 0; } * { 상자 크기 조정 : 국경 상자; } {셀에만 표시 : 플렉스; 굴곡 방향 : 칼럼; 높이 : 100vh; } .flex { 플렉스 : 1; } 셀에만 셀에만> * { 국경 : 1 픽셀의 고체; }

   일부 콘텐츠

   이 사용할 수있는 공간 채운다

   다른 내용

   건배!

2. ---

   2.중간 DIV에 1 : 부모와 플렉스에 열 : 그냥 플렉스 방향을 사용해야합니다.

   중간 DIV에 1 : 부모와 플렉스에 열 : 그냥 플렉스 방향을 사용해야합니다.

   신체, HTML { 패딩 : 0; 여백 : 0; } {셀에만 표시 : 플렉스; 굴곡 방향 : 칼럼; 최소 신장 100vh; } 셀에만> DIV :하지 (.flex) { 배경 : # 676EE0; } .flex { 플렉스 : 1; 배경 : # 67E079; }

   일부 콘텐츠

   다른 내용

from https://stackoverflow.com/questions/40020921/flexbox-fill-available-space-vertically by cc-by-sa and MIT license