페이지에서 div의 수평 흐름을 재 저장하는 방법

어떻게 다중 높이 div 그룹 사이의 간격을 수직으로 취할 수 있습니까? 그렇다면 이들 사이의 간격이 일관되게 동일합니까? div 너비는 고정되어 있습니다. 높이는 다양합니다. div의 양은 다양합니다. 다음은 JsFiddle Example입니다. 원하는 간격이 충족 될 때까지 javascript를 사용하여 marginTop을 마이너스 값으로 동적으로 설정하는 방법이 있습니까?페이지에서 div의 수평 흐름을 재 저장하는 방법

body { 
background-color: #AFC2EB; 
padding: 10px; 
} 

body .section { 
border: 2px solid #0000CC; 
margin: 5px; 
background-color: #CCCCCC; 
border-radius: 5px; 
width: 150px; 
float: left; 
} 

<body> 
<form id="form1" runat="server"> 
    <div id="parent_div" style="width: 500px;"> 
     <div id="div1" style="height: 200px;" class="section"></div> 
     <div id="div2" style="height: 100px;" class="section"></div> 
     <div id="div3" style="height: 50px;" class="section"></div> 
     <div id="div4" style="height: 200px;" class="section"></div> 
     <div id="div5" style="height: 100px;" class="section"></div> 
     <div id="div6" style="height: 50px;" class="section"></div> 
     <div id="div7" style="height: 100px;" class="section"></div> 
     <div id="div8" style="height: 200px;" class="section"></div> 
     <div id="div9" style="height: 50px;" class="section"></div> 
     <div id="div10" style="height: 100px;" class="section"></div> 
     <div id="div11" style="height: 100px;" class="section"></div> 
    </div> 
</form> 
</body>

출처

2013-06-24 TroyS

는 여기에 당신을 도울 수있는 일 오전 기사입니다 : http://designshack.net/articles/css/masonry/ 나도 제안 거라고 그냥 어떤

출처

2013-06-24 16:44:19

. 훌륭한 일을합니다. 비록 당신은 여전히 어떤 차이가있을 수 있음을 알고 있습니다. –

나는이 [example] (http://osvaldas.info/responsive-jquery-masonry-or-pinterest-style-layout)을 따라 일할 벽돌을 가지고있다. 고마워. – TroyS

페이지에서 div의 수평 흐름을 재 저장하는 방법

답변

관련 문제