0

次のページは、ワードプレスポートフォリオサイトのサムネイルギャラリーです。

http://rosspw.com/snippets/

私が対処しようとしている問題は、3列のギャラリーグリッドレイアウトが壊れている理由を理解することです。最初の3つのサムネイルが表示され、次にグリッドレイアウトが壊れます。

ギャラリーグリッドは、次のwordpress/phpコードで作成されます。

<div id="project-thumbs">       
<?php
                    query_posts( array(
                        'ignore_sticky_posts' => 1,                     
                        'posts_per_page' => 24,
                        'post_type' => array('snippet')
                        )); ?>                              
                    <?php  while (have_posts()) : the_post(); ?>
                        <div class="project-box one-third float-left">      
                            <?php get_template_part( 'part-project-thumb'); ?>
                        </div>
                <?php endwhile; ?>
                <?php wp_reset_query(); ?>      
        </div>

また、「project-thumbs」に使用しているCSSスタイルは次のとおりです。

#project-thumbs {
margin: 0 auto;
text-align: center;
min-height: 625px;
padding-top: 35px;

}

6つのサムネイルの後でグリッドレイアウトが壊れる理由を理解するのを手伝ってもらえますか？ありがとう！

4

1 に答える 1

2

次のように、.project-boxクラスに高さを追加します。

.project-box { height: 250px; }

浮いた要素の高さが変化していたため、浮きが壊れていました。

于 2012-08-19T02:10:13.733 に答える