/ / FoundationとWordpressの空白スペース - wordpress、zurb-foundation

FoundationとWordpressの空白スペース - wordpress、zurb-foundation

誰でも 空白 私はWordPressの基盤フレームワークを使ってwhileループに入っていますか?

    <div class="large-8 columns">

<?php query_posts(array("category_name" => "revista", "paged" => get_query_var("paged"), "posts_per_page" => 9 )); ?>

<?php while ( have_posts() ) : the_post(); ?>

<article class="boletin large-4 columns" style="min-height:1px;">

<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>

<h2><a href="<?php the_permalink(); ?>"><?php the_title();?></a></h2>

</article>

<?php endwhile; ?>

</div><!-- /large-8 -->

<?php get_sidebar(); ?>

</div>

ここはページです(使用してください CTRL + F5 最新版を見る)

http://www.aoa.cl/revistas/

回答:

回答№1は0

これが起こる理由は、タイルの高さが同じでないことです。 あなたは使うことができます 財団イコライザー それを修正する。あなたが持っているコードを残してください。私はまだ大小を変えて

<article class="small-12 medium-6 large-4 columns">

より良い応答結果を得ることができます。 財団はモバイルファーストです。小さな画面用のコードが最初にあり、大きい方のデバイスはそのスタイルを継承します。必要に応じて大画面用にカスタマイズします。

両方の列が3つしかない場合モバイルとデスクトップは以下のことを行います: 私は3行ごとに行を追加しています。また、大きなものから小さなもの(大きなスクリーンは小さなものよりもはるかに優れたものを継承します)を大きく変更しました。

<div class="small-8 columns">
<?php $count=0;?>
<?php query_posts(array("category_name" => "revista", "paged" => get_query_var("paged"), "posts_per_page" => 9 )); ?>

<?php while ( have_posts() ) : the_post(); ?>
<?php if ($count % 3 == 0): ?>
<div class="row">
<?php end_if; ?>
<article class="boletin small-4 columns" style="min-height:1px;">
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>

<h2><a href="<?php the_permalink(); ?>"><?php the_title();?></a></h2>

</article>
<?php if ($count % 3 == 2): ?>
</div>
<?php end_if; ?>
<?php $count++; ?>

<?php endwhile; ?>

</div><!-- /small-8 -->

<?php get_sidebar(); ?>