wordpress ループの一部である 2 つの div 間のインライン ブロック スペースを削除するにはどうすればよいですか? それらは、それぞれが 50% の幅で並んで座るはずです。幅を 49% に変更したり、フロートを使用したりできることはわかっていますが、可能であればこのままにしておきたいと思います。
以下のように、コメントを使用してコーディングの空白を削除することで、通常はそれを行うことができます。
<div class="before-after">
<img src="images/ba_01.jpg" alt="">
<h4>Frick TDSH 355XL<br><small>Slide Valve and Rotor Housing</small></h4>
</div><!-- this comment here eleminates the spacing
--><div class="before-after">
<img src="images/ba_02.jpg" alt="">
<h4>Frick NGC300 Gear Plate</h4>
</div>
これは私の wordpress ループであり、コメントをどこに置いても、実際に返される html に空白が追加されます。
<?php
$my_query = new WP_Query(
array(
'cat' => '2',
)
);
while ( $my_query->have_posts() ) : $my_query->the_post();
?>
<div class="before-after">
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
?>
<h4><?php the_title(); ?><br><small><?php the_content(); ?></small></h4>
</div><!-- --><?php endwhile;?><?php wp_reset_postdata();?>
そして、これは開発者ツールに表示されているものです:
<div class="before-after">...</div>
<!---->
<div class="before-after">...</div>
<!---->
簡単なことを見落としているだけだと思いますが、何か助けていただければ幸いです。ありがとう!
ここの@Prusprusは、ソースコードから直接です:
<div class="before-after">
<img width="500" height="300" src="http://localhost:8888/wp-content/uploads/2013/10/ba_02.jpg" class="attachment-post-thumbnail wp-post-image" alt="Frick NGC300 Gear Plate" />
<h4>Frick NGC300 Gear Plate<br><small></small></h4>
</div>
<!---->
<div class="before-after">
<img width="500" height="300" src="http://localhost:8888/wp-content/uploads/2013/10/ba_01.jpg" class="attachment-post-thumbnail wp-post-image" alt="Frick TDSH 355XL" />
<h4>Frick TDSH 355XL<br><small><p>Slide Valve and Rotor Housing</p>
</small></h4>
</div>
<!---->