0

我正在使用 Wookmark 插件,非常棒。但是,在 Chrome 和 Safari 中观看时,最后一项与其他一项重叠。奇怪的是,当我点击 CMD+R 时它会重叠,但是当标记 URL 并点击 ENTER 时它不会重叠。在 Firefox 中观看时,它永远不会重叠,一切都很好。

其次,当使用偏移量时,它会应用水平而不是垂直的全部像素。所以我必须在项目中添加一个 padding-bottom。

代码

$('.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 -->

截图:截图

4

1 回答 1

0

我自己找到了答案。

看起来您必须在 img 属性中为图像提供特定的高度和宽度。偏移问题是由于我给出的 itemWidth 值不正确,我深表歉意。

于 2013-08-19T07:52:13.683 回答