Wordpressで不必要な隙間をなくしたい。

Question

Wordpressで記事を表示させています。
１つはランダムに取得した記事のアイキャッチを表示、
１つは新着記事の一覧です。
画像で見てわかるように画像の上下左右に8pxの隙間と画像の間に隙間ができています。
この隙間をなくすにはどうしたらいいでしょうか？
テーマはtwentyseventeenを使っています。

「試したこと」

* {
	margin:0;
	padding:0;
}

body {
	margin:0;
}

img {
	vertical-align:bottom;
}

bodyにmargin:0;とimgにvertical-align:bottom;を使ってみましたがうまくいきませんでした。

「ソース」

<!-- ランダム記事表示 -->
<?php
$loop = new WP_Query('showposts=4&orderby=rand');
while ( $loop->have_posts() ) : $loop->the_post();
?>

<p><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?><br><?php the_title(); ?></a></p>

<?php endwhile;wp_reset_query(); ?>

			<?php
$args = array(
'posts_per_page' => 14 // 表示件数の指定
);
$posts = get_posts( $args );
foreach ( $posts as $post ): // ループの開始
setup_postdata( $post ); // 記事データの取得
?>
<li>
<a href="<?php the_permalink(); ?>"><?php echo get_the_post_thumbnail($post->ID); ?><?php the_title(); ?></a>
</li>
<?php
endforeach; // ループの終了
wp_reset_postdata(); // 直前のクエリを復元する
?>

Answer 1

全体が分からないので、とりあえず、!important をつけて、優先度を高くしたらどうなるでしょうか？

* {
    margin:0 !important;
    padding:0 !important;
}

Comments

[CHERRY]

他への影響が大きそうだけどなぁ...

[退会済みユーザー]

ありがとうございます。試してみましたがだめでした。他の方法も探ってみます。

[退会済みユーザー]

index.phpのソースも掲載しました。

[CHERRY]

さすがに PHP のコードだけでは、どこにどの CSS が当たっているかわからないので、判断は難しいです。

おそらくブラウザに表示されている HTML と CSS ソースを見れれば、隙間の特定は比較的簡単だと思うので、頑張ってください。

[退会済みユーザー]

わかりました。なんとか検証機能を使って頑張ってみます。