Php Css列看起来不正确

嗨，我想知道是否有更好的方法来做这件事，因为它看起来不正确的方式，我有它的设置

这是我到目前为止看到的，看起来很糟糕，我使用了列计数，但它看起来不正确，这是它现在看起来的图像。

当屏幕改变大小时，这会改变，它看起来会很难看，它不会停留在3行中，因为某种原因它会变成第4行。。。它不应该越过广告的右侧，也不应该在底部剪掉，在顶部留有空白。我想让它看起来像pinterest，但我不确定在jquery中如何做到这一点，我只需要将它们排列起来，而不是在显示视图和挂起的位置截断。请帮忙，谢谢

这是我的css：

#gallerycontainer {

   -webkit-column-count: 3;
   -webkit-column-gap:   0px;
   -moz-column-count:    3;
   -moz-column-gap:      0px;
   column-count:         3;
   column-gap:           0px;
   column-fill: balance;
-moz-column-fill: balance;
-webkit-column-fill: balance;
   width: 840px;
    height:100%;

 position: relative;
}

#gallery li{
width: 265px;

}

#gallery li img {
  border: 5px solid #fff;
  -webkit-transition: box-shadow 0.5s ease;
  -moz-transition: box-shadow 0.5s ease;
  -o-transition: box-shadow 0.5s ease;
  -ms-transition: box-shadow 0.5s ease;
  transition: box-shadow 0.5s ease;
    max-width:250px;
    max-height:200px;
    padding:2px;

}
.galleryinfo{
     border: 2px solid #fff;
     padding-bottom: 40px;
     float: left;
     margin:9px;
     background: white;
     overflow: hidden;
     width: 100%;


}

下面是html和php，用于获取要显示的图像

<div id="gallery">
        <div class="galleryinfo">
        <li id="<?php print $id?>">
        <a class="fancybox" rel="group" href="photos/<?php print $picture?>"><img src="photos/<?php print $picture?>"/></a>

        Views : <?php print($unique) ?>
        <?php print($pending) ?>
        </li>
    </div>
<?php
}}
?>

看起来你想要品特瑞风格。查看此项-它将帮助您：
设置
或
显示：内联块
规则，它不应再拆分为两列

如果浏览器理解此规则：
内部分栏：避免
，则它是用来避免将盒子喷入2列的工具。
应该是
，并在脚本后面用
关闭。。。或者
另一个标记您是否有指向多媒体资料的链接（如果使用了“显示+浮动”，则“显示”无效）