人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

wordpress3.5に関して質問です。

http://dca-labo.info/demo8/testimg/sample_12.jpg

カテゴリー説明文の下に区切り線を入れたいと思っています。
場所は上記画像を確認頂ければと思います。
自分で色々やってみたのですが該当箇所にうまくできませんでした。
宜しくご教授頂ければと思います。

●質問者: mkusume
●カテゴリ:インターネット ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● a-kuma3
●140ポイント ベストアンサー

カテゴリー説明文の下に区切り線を入れたいと思っています。

こんな感じで。

.category-archive-meta {
 border-bottom: 1px solid black;
}

「ここのスペースを詰めたい」については、クラス page-title の margin が効いているからです。
style.css の、以下の定義の 2.6em です。

.page-title {
 color: #666;
 font-size: 10px;
 font-weight: 500;
 letter-spacing: 0.1em;
 line-height: 2.6em;
 margin: 0 0 2.6em; /* ※この 2.6em */
 text-transform: uppercase;
}

margin: 0; というふうにすれば、カテゴリー説明文との間が詰まります。

もうひとつスペースが空いている理由として、カテゴリーの説明の前に全角の空白が二つ入っている個所があります。

 <h1 class="page-title"><span>ABC</span></h1>
<!-- 0316修正 -->
   <!-- ※ ここに全角のスペースが二つ入っています。 -->
<!-- 0316修正 -->
 <div class="category-archive-meta"><p>ここにカテゴリーABCの説明文が入ります。ここにカテゴリーABCの説明文が入ります。ここにカテゴリーABCの説明文が入ります。ここにカテゴリーABCの説明文が入ります。ここにカテゴリーABCの説明文が入ります。ここにカテゴリーABCの説明文が入ります。</p>

全角のスペースを削除して、.page-title の margin-bottom の値を、自分の好みの間隔になるような数値に調整する、という感じで良いと思います。


a-kuma3さんのコメント
ページタイトルとカテゴリーの説明の間のスペースについて、ちょっと書き足しました。

mkusumeさんのコメント
早速の対応ありがとうございます。

mkusumeさんのコメント
ありがとうございます。解決しました。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ