플렉스 박스로 윈도우 메트로 스타일 레이아웃을 재현 할 수 있습니까?

Question

중첩되지 않은 플렉스 상자를 사용하여 이러한 유형의 레이아웃을 구현할 수 있습니까?

내가 맞지 않는다면 상자가 다음 줄로 갈 것이라는 것을 안다. 그러나 더 많은 플렉스 상자를 중첩하지 않고 위 스크린 샷과 같이 가변 높이 상자를 얻으려면 어떻게해야합니까?

Answer 1

예, 일부 일반적인 CSS 플로팅 기반 그리드를 사용하면 이와 같은 박스형 레이아웃을 만들 수 있습니다. 예를 들어 this example 및 how the author did it을 참조하십시오.

또한 MS는 MSDN에 설명 된 W3C에 "CSS Grid Layout"이라는 표준을 제안했습니다. flexbox를 지원하지 않고 그러한 레이아웃을 생성 할 수 있습니다. 그것은 IE 외부에서 채택 된 적이 없지만 IE에 대해서만 신경 쓸 필요가 있다면 사용할 수 있습니다.