2015-02-02 2 views
-1

동적으로 행을 생성 할 webapp를 만들려고합니다. (각각 래퍼 div가 있음) 이러한 행은 동일 할 것입니다. height (기본적으로 - N 행이있는 경우 , 각 높이는 'pageHeight/N'에 의해 결정되어야 함).동일한 높이를 가진 div 요소 (행)로 반응 형 페이지 만들기

요소는 div 유형이어야하고 내부 li이 인 ul이 아니어야합니다 (목록이 아니며 올바른 HTML을 작성하려고합니다). 외부 ( 그래서 난 디스플레이 - 테이블의 CSS 스타일로 이것을 만들려고 한 -

이 솔루션은 CSS에 중계 할 것이다 ( 그것은 올바른 방법으로되지 않을 것 JS는이 문제를 해결할 수 있지만, 다시) 래퍼) 및 테이블 행 (각 행의 래퍼) 하지만 알아낼 수 없습니다. 당신은 인 flexbox 사용할 수

+1

에 오신 것을 환영합니다 SO. 먼저 질문을하지 않았습니까? 두 번째로 코드를 게시하지 않았거나 이미 시도한 작업의 예를 들었습니다. 이 사이트는 코딩 문제가있는 사람들이 자신을 위해 일하지 않도록 돕는 것입니다. 더 구체적으로 말하십시오. – crazymatt

답변

0

미리 :)에서

감사 : (플렉스 항목 #과 요소의 수를 줄일 수)

.flex-container { 
    display: -webkit-flex; 
    display: flex; 
    -webkit-flex-flow: row wrap; 
    flex-flow: row wrap; 
} 

.flex-item { 
    -webkit-flex: 2 0 auto; 
    flex: 2 0 auto; 
} 

확인이 : http://bennettfeely.com/flexplorer/

관련 문제