이미지 갤러리에 공백 제거하기

Question

안녕하세요,이 사람이 올바른 용어인지 모르겠지만, 이미지 갤러리를 벽돌을 사용하는 아이디어가있는 부트 스트랩에 빌드하면, 기본적으로 모든 것이 다른 크기로되어 있습니다. 내 문제는 전입니다. 내 갤런 사이에 큰 격차가 있고 나는 그것을 어떻게 제거 할 수 있는지 궁금해하고 있었다. 내 문제는 다음과 같습니다

<div class="row"> 
    <div class="card-columns"> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x600" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x700" alt="Card image cap"> 
    </div> 
    </div> 
</div> 
    <div class="row"> 
    <div class="card-columns"> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x600" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x300" alt="Card image cap"> 
    </div> 
    <div class="card"> 
     <img class="card-img-top" src="http://placehold.it/500x700" alt="Card image cap"> 
    </div> 
    </div> 
</div> 

저를 알려 주시기 바랍니다 : 이

내가 빨간색 원 안에 그 공간 멀리 갈 수 있고 즉, 내가

이

HTML 함께 연결할 수 있으므로 싶습니다 이 일을 더 쉽게 할 수있는 방법이 있는지, 부 풀랩 3을 사용하고 있는지, 아니면 바보 같은 일을하고 있다면이 아이디어를 사용하여 갤러리를 만들고 싶습니다. 그러나 그 큰 공간을 없앨 수 있습니다.

고마워요.

Answer 1

여러 행을 사용하려고하면 그 간격을 피할 수 없습니다. 모든 페이지에는 행이 하나만 있지만 행은 여러 개가됩니다. 그러면 아무런 격차도 없을 것입니다. 의사 코드는 다음과 같다 :

<div class=row> 
    <div class="col-sm-2"> 

     images 
    </div> 
    <div class="col-sm-2"> 

     images 
    </div> 
    <div class="col-sm-2"> 

     images 
    </div> 
    <div class="col-sm-2"> 

     images 
    </div> 
    <div class="col-sm-2"> 

     images 
    </div> 
<div>