태블릿보기에서 Flexbox 다루기

Question

웹 사이트의 렌더링 문제를 해결하는 데 도움이되었습니다. 특히, 플렉스 박스 요소는 태블릿에 표시 될 때 모두 불안정합니다. 데스크톱 테스트에 따르면 페이지의 너비와 높이가 Chrome Dev 도구의 iPad 또는 iPad Pro로 설정된 경우에만 문제가 발생합니다.

에는 "당사의 최고 연습 분야"라는 섹션이 있습니다. 데스크톱 또는 모바일보기에서이 섹션은 아름답게 작동하지만 768x1024에서는이 섹션이 뷰포트의 오른쪽 열에 고정되어 있습니다. Flexbox를 어떻게 만들 것인가에 대한 아이디어는 이런 식으로 모두 괴롭 혔습니까?

Answer 1

는 요소는 최소한의 예에서 관련 코드를 게시 할 수

@media (max-width:768px) { 
     .fusion-layout-column .fusion-column-content-centered { 
     display: inline-block; 
     } 
     .fusion-layout-column .fusion-column-content-centered .fusion-column-content { 
     text-align: center; 
     } 
    }