Wookmark插件偏移和重疊

我正在使用Wookmark插件，這非常棒。但是，在Chrome和Safari中觀看時，最後一項與其他項中的其中一項重疊。奇怪的是當我點擊CMD + R它重疊時，但是當標記URL並按下ENTER時它不會重疊。在Firefox中觀看時，它永遠不會重疊，一切都很好。Wookmark插件偏移和重疊

其次是當使用偏移量時，它將應用全部像素水平但不垂直。所以我必須添加一個填充底部的項目。

代碼

$('.post').wookmark({ 
    container: $('.grid'), 
    autoResize: true, 
    align: 'left', 
    itemWidth: 365, 
    offset: 15 
});

HTML

<div class="post" data-id=""> 

    <div class="post-content rounded-top"> 
     <header> 
      <img class="post-profile-pic rounded" src="<?php ROOT ?>graphic/profile/mette.jpg"> 
      <div class="post-author-name">Mette-Line Laurvig Nielsen</div> 
      <div class="post-stamp">2<?php $print->output('h'); ?> ago</div> 
     </header> 
     <article>Let's turn up the music! I am very nervous that this won't work in the end. What do you guys think? Please tell me the truth :) And a lot of nervousity.</article> 
     <div class="post-details"> 
      <span class="post-like"><?php $print->output('like'); ?> &nbsp;·&nbsp;</span> 
      <span class="post-likes"><i>3</i> <?php $print->output('likes'); ?></span> 
      <span class="post-comments-count"><i>17</i> <?php $print->output('comments'); ?></span> 
     </div><!-- .post-details --> 
    </div><!-- .post-content --> 

    <div class="comment-wrap post-comments rounded-top"> 
    </div><!-- .post-comments --> 

    <div class="comment-wrap post-write-comment rounded-bottom"> 
     <form method="post"> 
      <textarea class="rounded-bottom" type="text" name="" placeholder="<?php $print->output('write your comment...'); ?>"></textarea> 
     </form> 
    </div><!-- .post-write-comment --> 

</div><!-- .post -->

截圖：Screenshot

來源

2013-08-19 skolind

添加一些代碼並更新您的問題 –

您可以1）發佈問題的屏幕截圖，以及2）將代碼粘貼到問題中？ –

當然。幾分鐘後掛斷。 – skolind

，我發現自己的答案。

看起來像你必須給圖像特定的高度和寬度在img屬性。偏移問題是由於我給出的itemWidth中的值不正確，我很抱歉。

來源

2013-08-19 07:52:13 skolind

Wookmark插件偏移和重疊

回答

相關問題