0
今私は3つの投稿を1行に、3つの投稿を次の行に、そして1つの投稿を次の行に入れています。私は行を3つ持つ投稿の間にスペースを追加しようとしています。私はCSSマージンを追加するたびに - 右：25px; .cool-mod-4には空白が追加されますが、1つのポストがその行からノックアウトされ、代わりに2つのポストが3行あります。誰にも解決策はありますか？ （私は、問題のスクリーンショットとDropboxのリンクを添付している）投稿の行にmargin-rightを追加することができません
https://www.dropbox.com/sh/fbi17l2ortzpqkk/AACDm2XIcvJDjouAb0zPilfVa?dl=0
ここでは私のindex.php
<?php
/*
* Template Name: learningwordpress
*/
get_header();
$i = 0;
$args = array(
'posts_per_page' => 14,
'paged' => 1
);
$the_query = new WP_Query($args);
if ($the_query->have_posts()) {
while ($the_query->have_posts()) {
if($i %2 == 1) {
$the_query->the_post(); ?>
<article class="post col-md-4">
<?php the_post_thumbnail('medium-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php $the_query->the_post(); ?>
<article class="post col-md-4">
<?php the_post_thumbnail('medium-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php $the_query->the_post(); ?>
<article class="post col-md-4">
<?php the_post_thumbnail('medium-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php $the_query->the_post(); ?>
<article class="post col-md-4">
<?php the_post_thumbnail('medium-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php $the_query->the_post(); ?>
<article class="post col-md-4">
<?php the_post_thumbnail('medium-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php $the_query->the_post(); ?>
<article class="post col-md-4">
<?php the_post_thumbnail('medium-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php
}
else {
$the_query->the_post(); ?>
<article class="post col-md-12">
<?php the_post_thumbnail('large-thumbnail'); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p>
<?php echo get_the_excerpt(); ?>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
</p>
</article>
<?php
}
?>
<?php
$i++;
}
}
else {
echo '<p>Sorry, no posts matched your criteria.</p>';
}
get_footer();
'margin-right'の代わりに' padding-right'を追加しようとしましたか？ –
はい、私はすでにパディングの権利を試しましたが、何もしませんでした。 – user6738171
各col-md-4の内側のコンテナの間にコンテンツを配置する方がよいでしょう。このコンテナでは、col-md-4の内側に余白または余白を設定することができます。 –