CSS - row with col-md-6 containing photos is not aligned correctly

I have a listing of 8 photos and then I have a button that carries me two more photos. However, the photos do not appear correctly aligned because a hole always appears without any photographs.

ThecodeIhaveisthefollowing:

<divclass="row">
            <div class="col-lg-10 col-lg-offset-1 text-center">
                <h2>Portfolio</h2>
                <hr class="small">
                <div class="row">
                <?php
            $query=mysqli_query($db,"select id_album, nome, foto from albuns order by id_album ASC limit 8");
             while($cat=mysqli_fetch_assoc($query)){?>
                    <div class="col-md-6">
                        <div class="portfolio-item">
                        <p class="imgDescription"> <?php echo $cat['nome'];?> </p>
                            <a href="#">
                                <img class="img-portfolio img-responsive" src="<?php echo $cat['foto'];?>" onClick="location.href='listagem_album.php?id=<?php echo $cat['id_album'];?>'">
                            </a>
                        </div>
                    </div>
                    <?php } ?>

             <?php
            $query=mysqli_query($db,"select id_album, nome, foto from albuns order by id_album DESC limit 2");
             while($cat=mysqli_fetch_assoc($query)){?>
                    <div class="col-md-6" id="fotos" >
                        <div class="portfolio-item">
                        <p class="imgDescription"> <?php echo $cat['nome'];?> </p>
                            <a href="#">
                                <img class="img-portfolio img-responsive" src="<?php echo $cat['foto'];?>" onClick="location.href='listagem_album.php?id=<?php echo $cat['id_album'];?>'">
                            </a>
                        </div>
                    </div>
                   <?php } ?>
                </div>
                <!-- /.row (nested) -->
                 <div id="button" style=" width: 150px;height: 75px;"><a class="btn btn-dark" style="margin-left: 400px;
margin-top: 0px;">View More Items</a></div>
            </div>
            <!-- /.col-lg-10 -->
        </div>