FF 34.x 이상에서 FF 33.x Flexbox 호환성을 어떻게 유지할 수 있습니까?

FF 34.x에서 FF 33.x Flexbox 호환성 확보

Firefox 34.x에서는 Flexbox 동작이 수정되었습니다. 이로 인해 이전의 일부 기능적 레이아웃이 중단되었습니다.

암시된 최소 크기 문제

FF 33.x와 34.x Flexbox 구현 간의 주요 차이점은 암시된 최소 크기에 중점을 두고 있습니다. 플렉스 아이템의 최소 크기. FF 34.x에서는 이 기능이 다시 도입되어 레이아웃 동작에 영향을 줍니다.

FF 33.x 동작 다시 만들기

FF에서 FF 33.x 동작을 복원하려면 34.x 또는 35.x, 이 CSS를 적용하세요 규칙:

* { min-height:0 }

이 규칙은 최소 높이를 0으로 보편적으로 설정하여 새로운 기본 동작을 재정의합니다.

대상 애플리케이션

위의 내용은 규칙은 간단한 솔루션이므로 min-height:0은 필요한 특정 요소에만 이상적으로 적용되어야 합니다. 특히 이 규칙은 다음과 같은 모든 요소에 적용되어야 합니다.

• 열 지향 플렉스 컨테이너의 하위 요소입니다
• 오버플로가 허용되어야 하는 키가 큰 하위 항목을 포함합니다

예

예를 들어, 오버플로 문제를 해결하기 위해 제공된 바이올린(http://jsfiddle.net/yoL2otcr/1/) min-height:0을 적용했습니다.

추가 정보

이 특정 Flexbox 사양 변경에 대한 추가 정보와 예를 보려면 Mozilla 버그 추적기를 참조하세요. https://bugzilla.mozilla.org/show_bug.cgi?id=1043520

위 내용은 FF 34.x 이상에서 FF 33.x Flexbox 호환성을 어떻게 유지할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!