플로팅 DIV는 pintrest.com을 좋아합니다.

약간의 문제가 있습니다. 절대 배치 된 래퍼 div에 여러 상대적으로 배치 된 DIV가 있습니다. 이제 나는 그들이 pintrest.com과 같아 지길 바란다. 하지만 내 결과는 다음과 같습니다플로팅 DIV는 pintrest.com을 좋아합니다.

이

http://d.pr/CHCq (droplr.com에 이미지 링크)

는 CSS :

이

div.post { 
position: relative; 
width: 250px; 
margin: 0 0px 14px 14px; 
background-color: #eae9e9; 
float: left; 
}

는이에 대한 효율적인 해결을 아십니까? 아니면 세 개의 기둥을 만들겠습니까? 미리 감사드립니다.

[jquery masonry] (http://masonry.desandro.com/) 사용을 고려해보십시오. 또는, 폭이 정적이라면 괜찮습니다. 언급 한대로 3 열. –

@JamesMontagne 대단히 감사합니다! 그 플러그인은 완벽하게 그것을 해결했습니다! 답변을 추가하면 "수락 된 답변"으로 설정됩니다. –

답변이 게시되었습니다. 도와 줄 수있어서 기뻐. –

jquery masonry을 사용하는 것이 좋습니다. 또는, 폭이 정적이라면 괜찮습니다. 언급 한대로 3 열.

2012-02-28 21:05:23

DIV 또는 TABLE을 사용하여 열을 분할 한 다음 열 컨테이너에 "세로 맞춤 : 위쪽"을 설정해야합니다.

플로트는 사용자가 원하는 것을하지 않으며, 인라인 블록도 표시하지 않습니다.

한 가지 대안은 모든 상자의 높이를 동일하게 설정 한 다음 float 대신 "display : inline-block"을 사용하는 것입니다.

2012-02-28 18:26:31 Joshua

3 개의 열을 사용하면 문제의 금식 솔루션이되므로 효과적입니다.

2012-02-28 18:39:10

답변