何らかの理由で、タイトルと詳細の間のこの大きなギャップを削除する方法がわかりません。さまざまな領域を調べましたが、パディングが追加されているのがわかりません。削除したい領域を赤でマークしました。唯一のトリッキーな部分は、「ヘビーデューティーメカニック」をクリックすると、ページに影響を与えずにこのスペースを削除したいということです
簡単な質問で申し訳ありませんが、試してみましたが、理解できないようですが、何かを見落としているに違いありません。
http://jobspark.ca/job-listings/
「フッター」要素には 24px のマージントップがあります。これは HTML の構造です。
<header>
(space because the header is 45px)
<div class="body">
(space because the footer has margin-top: 24px)
<footer>
「Heavy Duty」をクリックして作成されたページでは、フッターとその余白と上部の間隔がまだ残っています。「body」div の長いテキストのチャンクの直後です。あなたが提供したリンクでは、本文が空であるため、ヘッダーのすぐ下にマージン上部のスペースが表示されています。margin-top を上書きする場合は、このページ専用の CSS/Javascript を追加する必要があります。Chrome を使用している場合は、要素を右クリックして [要素の検査] をクリックし、右側で [計算済みスタイル] をクリックすると、margin-top が表示されます。
.article-metaルールには が含まれています。margin-top:24pxこれが原因でしょうか?
さらに、h1ルールはmargin-bottom:24px.