只有部分响应浏览器窗口的元素会调整大小

Question

我正在构建一个画廊，但似乎每次我调整浏览器窗口大小时，某些部分（图库信息div）不会立即响应调整大小，我需要将光标悬停在其上以使其刷新并移动到它应该是。有没有类似的经历？

网站：www.test.com

图片链接： http://i405.photobucket.com/albums/pp133/trancisky/ScreenShot2014-06-14at91954PM.png

我的每个瓷砖的html：

  <div class="main-wrapper">
  <div class="section first">
    <div class="container">
      <div class="portfolio-grid portfolioContainer ">
       <ul id="thumbs" class="col3"><li class="item">
      <div class="portfolio-image-wrapper">
      <img src="assets/img/gallery/1.jpg" alt="" />
      <div class="edit-menu">
        <a href="#" target="_blank">Rename</a>
        <a href="#" target="_blank">Delete</a>
      </div>
      <div class="item-info-overlay">
        <a class="hideModelLink" href="#">ModelLink</a>
      </div>
    </div>
    <div class="item-info">
      <h4 class="text-dark no-margin title semi-bold"><a class="" target="_blank" href="#">Mobile App</a></h4>
      <p>4/15/2014</p>
    </div>
    <a class="edit-button"></a>
    <div class="clearfix"></div>
  </li>

我的css for＆＃39; item-info＆＃39;（无法响应调整大小的div）：

.item-info {
    float: left;
    margin-top: 0;
    padding: 10px 17px;
    max-width: 200px;
}
.item-info h4.title{ 
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -moz-binding: url('assets/xml/ellipsis.xml#ellipsis');
}

谢谢！