Bootstrap - 如果窗口调整大小,列位置会跳跃?

时间:2015-12-17 20:04:12

标签: php html css twitter-bootstrap

编辑:更新了代码并将其清理干净并几乎完全重写

我目前在使用bootstrap列遇到一个非常奇怪的问题。我为客户编写了网站,并注意到,在我动态创建的项目列表中,当您在chrome中调整窗口大小时,最后一列在从左下角到中下游的位置上快速跳转。另外,在firefox中,磁贴只是停留在底部中间,但是如果你看一下代码,这根本不是这种情况,因为它只是正常的col-md-4s之后。

导致此问题的原因是什么?

编辑:确定没关系,它只是一个浮动问题与bootstrap divs ...

如果需要,创建列的PHP代码:

<?php
$pagelinks = array();
$currentWork = 0;

<div class="container-fluid" >
    <div class="row">

<?php 

$posts = get_posts(array(
    'posts_per_page'    => -1,
    'post_type'         => 'post'
    ));

if( $posts ): 

    foreach( $posts as $post ): setup_postdata( $post );

            <div class="col-xs-6 col-md-4 col-small-padding portfolioImage">           
                <a href="<?php the_permalink(); ?>">
                    <div class="box">          
                        <img src="<?php echo get_field('projekt-vorschaubild'); ?>">
                        <div class="caption fade-caption defaultFont">
                        <?  if(get_field("ausgezeichnetes_projekt") == true){
                                echo '<img src="';
                                echo bloginfo('template_directory');
                                echo '/images/icons/Icon_Awarded_Project.svg" class="awardedIcon"><h2>'.get_field('title').'</h2>';
                        }
                            else
                                echo '<h2>'.get_field('title').'</h2>'; ?>
                        <p> <? get_field('caption'); ?> </p>
                        </div>
                     </div>
                </a>
            </div>

            <?php
            $currentWork++;

    endforeach;
    wp_reset_postdata();

endif; ?>

  </div> 

  </div>

0 个答案:

没有答案