0

我在本地开发的网站上使用同位素插件。我遇到了一个css问题,我希望有人能够帮助我。这是情况。

<div class="wrapper"> //* Position is relative
   <div class="portfolio1">  //* Position is absolute
      <div class="inner-wrapper">
         <div class="portfolio-container">
            <div class="portfolio-header"></div>
            <div class="portfolio-content"></div>
            <div class="portfolio-footer">
                <div class="comments"></div>
            </div>
         </div>
      </div>
   </div>
   <div class="portfolio2">  //* Position is absolute
      <div class="inner-wrapper">
         <div class="portfolio-container">
            <div class="portfolio-header"></div>
            <div class="portfolio-content"></div>
            <div class="portfolio-footer">
                <div class="comments"></div>
            </div>
         </div>
      </div>
   </div>
   <div class="portfolio3">  //* Position is absolute
      <div class="inner-wrapper">
         <div class="portfolio-container">
            <div class="portfolio-header"></div>
            <div class="portfolio-content"></div>
            <div class="portfolio-footer">
                <div class="comments"></div>
            </div>
         </div>
      </div>
   </div>
   <div class="portfolio4">  //* Position is absolute
      <div class="inner-wrapper">
         <div class="portfolio-container">
            <div class="portfolio-header"></div>
            <div class="portfolio-content"></div>
            <div class="portfolio-footer">
                <div class="comments"></div>
            </div>
         </div>
      </div>
   </div>
</div>

这几乎将投资组合项目放在一个网格中。我的问题是我有一个评论系统,里面添加了内联评论。发生这种情况时,“.portfolio”类会滑到页面上剩余项目的下方。有没有办法通过 css 或 jquery 来解决这个问题?我知道您可以使用相对定位元素并将它们浮动以防止它们在下方运行,但是一旦您这样做,同位素插件就会崩溃。这里也是问题的屏幕截图。 屏幕截图 干杯,迈克

4

1 回答 1

0

我猜评论是用 Ajax 插入的?也许有一些附加到它们的 CSS 可以被覆盖以不同地定位它们并将它们保持在它们的 div 中。

不过,同样可能的是,您不应该为此使用同位素。如果您仅使用同位素来创建网格,则可以使用更简单的方法(您可能只需要使用float)。Isotope 做了一些非常花哨的步法,在不同的浏览器中做的不同,并且非常喜欢处理具有漂亮、特定大小的元素。如果评论是用 javascript 添加的,改变 div就像Isotope 试图计算它将如何移动布局一样,你会遇到麻烦。

于 2012-11-18T18:13:08.250 回答