カスタムポストタイプは、サムネイルを表示 - 'イベント' の私のリストはこのように表示されている理由のWordPress

Question

誰もが知っているだろう：だから

質問：この代わりの

だろう;画像のサイズに関係なく、カスタム投稿タイプのリストをリストとして表示するにはどうしたらいいですか？現在、私は思う行の列として表示しようとしています - $ portfolio_count％4 == 0 - というコードのブロックを削除しようとしましたが、これはちょうどそれを中断します...

Here's my Loop：ここで

 <?php 
     $args = array( 
      'post_type' => 'events' 
     ); 
     $the_query = new WP_Query($args); 

     ?> 

     <?php if (have_posts()) : while ($the_query->have_posts()) : $the_query->the_post(); ?> 

     <div class="events-index"> 
      <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('event-thumb'); ?></a> 
      <a href="<?php the_permalink(); ?>"><h3><?php the_title(); ?></h3></a> 
      <h4><?php the_field('date_of_event'); ?></h4> 
      <p><?php the_field('location'); ?></p> 
     </div> 

     <?php $portfolio_count = $the_query->current_post + 1; ?> 
     <?php if ($portfolio_count % 4 == 0): ?> 

     <?php endif; ?> 

     <?php endwhile; endif; ?> 

はCSSです：

.events-index { 
    border-bottom: 1px solid #eee; 
    margin-bottom: 30px; 
    padding-bottom: 15px; 
} 

.events-index img { 
    float: left; 
    margin:0 25px 20px 0; 
} 

.events-index h4 { 
    margin:0 0 20px 0; 
} 

.events-index h4 { 
    margin:0 0 20px 0; 
} 

.events-index p { 
    color:#163a52; 
    font-style: italic; 
    margin: 10px 0 10px 0; 
} 

.events-index h4 { 
    color:#163a52; 
    margin-bottom: 0; 
} 

そして、私は現在のfunctions.phpファイルでこれを持っている：

add_image_size('event-thumb', 250, 150, true); // Hard Crop Mode 

Answer 1

これは、imgが左側にフローティングされているためです。 .events-indexブロックの後に、CSSブロックを追加します。

.events-index::after { 
    content: '.'; 
    display: block; 
    color: transparent; 
    clear: both; 
}