CSS (반응 형 디자인)로만 여러 div의 높이 조정

Question

응답 성이 뛰어난 디자인의 블로그가 있습니다. 이 블로그의 기사 페이지에는 각 기사 끝에 "관련 게시물"div가 있습니다.

이러한 div의 높이는 내용에 따라 가끔씩 바뀌며 레이아웃이 깨집니다. 잘하면 다음 이미지가 더 명확하게 문제를 설명합니다 :

나는 부모 컨테이너 내부의 div의 각 행을 포장하여 문제를 해결할 수 있었지만 다른 수 있기 때문에이 솔루션은 적합하지 않습니다 창 해상도에 따라 관련 게시물을 행별로 정렬합니다.

나는 어떤 사람들이 각 div의 높이를 비교하여 높이를 비교하여 Javascript로 그 문제를 해결하지만, 순수한 CSS 솔루션을 갖고 있다고 알고 있습니다.

아이디어가 있으십니까?

Answer 1

나는 CSS 솔루션을 요구하고 있기 때문에 jQuery 솔루션을 원한다면 의견을 말할 수 없다. masonary 플러그인을 사용할 수있다.

Answer 2

http://www.getbootstrap.com을 사용해 보셨나요? 이렇게하면 응답 성있는 레이아웃을 얻을 수 있으며 순수한 CSS가됩니다. 희망이 당신을 도울 것입니다

Answer 3

이것은 "야생"솔루션의 비트이지만, 이전에 같은 높이 열에 대한 CSS 전용 솔루션을 원했던 곳에서 사용했습니다. 즐기십시오 : http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks