Question

我是开发人员的新手，我已经找到了答案，但找不到与我的问题相符的解决方案。

我使用了一个（非常简单的）砌块来在我的项目中给出“自动调整大小”效果，但奇怪的是，当我调整浏览器大小时，似乎只会触发它。页面上的内容最初会在彼此堆叠的情况下开始，但是一旦浏览器调整大小，他们就会根据自己的需要进行自我调整。每个div包含我想要适合div的100％宽度的图像。

我正在使用Rails 4.2项目。这是我的Jquery / masonry：

$('.home-container').masonry({
itemSelector: '.article-show',
columnWidth: 100,
gutter: 10

}）;

以下是文章展示的HTML：

<div class="home-container">
  <% @articles.each do |article| %>
    <div class="article-show">
      <div class="image">
        <%= image_tag(article.image_one) %>
      </div>
      <div class="text">
       <%= article.artist %>
      </div>
    </div>
  <% end %>
</div>

这是'article-show'div的css，它出现了10次：

.home-container {
width: 95%;
margin: 0 auto;
text-align: center;
margin-left: 5.4%;
}

.article-show {
width: 20%;
display: inline-block;
margin-bottom: 10px;
}

.image {
width: 100%;
}

.article-show img {
width: 100%;
position: relative;
-webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

似乎已经发布了大量的砌体调整大小问题，但它们似乎只是解决了在调整浏览器时调整大小的问题 - 而我的启动错误。

我确定它必须与我的css有关，但我已经逐行删除了css，我似乎无法找到问题。

如果有人能指出我正确的方向，那将非常感激。

砌体 - 浏览器调整大小后才有效果

0 个答案: