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

wordpress3.5.1に関して質問です。テンプレートはtwenty-elevenを使用しています。対象サイトはhttp://dca-labo.info/demo9/です。
質問は2点です。
(1)各エントリーの日付の下に余白を入れたい。
(2)各エントリーの上下の余白をカットする。
詳細は画像を確認頂ければと思います。
上記2点の対応方法をご教授頂きたいと思います。

1372750148
●拡大する

●質問者: mkusume
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

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

(1)各エントリーの日付の下に余白を入れたい。

style.css に以下の記述を追加。

time.entry-date {
 display: block;
 padding-bottom: 20px; /* サイズは調整してください */
}

(2)各エントリーの上下の余白をカットする。

「全文を読む」の上にある余白は、style.css 370行目くらいの、以下の指定です。

/* Text elements */
p {
 margin-bottom: 1.625em; 
}

これを直接修正してしまうと、影響範囲が広すぎるので、以下の記述を style.css に追加するような感じでしょうか。

div.arrow > p:first-child {
 margin-bottom: 0;
}

記事と記事の間の余白は、style.css 820行目くらいのこの記述です。

.hentry,
.no-results {
 border-bottom: 1px solid #ddd;
 /* margin: 0 0 1.625em; */
 margin: 0 0 1.625em; /* ★これが、記事と記事の間の余白 */
 /* padding: 0 0 1.625em; */
 padding: 0 0 1.625em;
 position: relative;
}

margin-bottom を 1.625em よりも小さくしてください。

一番最初の記事の上の余白は、style.css の 790行目くらいのこの指定。

#main {
 clear: both;
 padding: 1.625em 0 0; /* ★これが、最初の記事の上の余白 */
}

この padding-top を小さくしても良いのですが、そうすると左側にあるタイトルのナビゲーションも上にずれます。
もし、それが嫌だったら style.css の 210行目当たりの記述で、margin-top を負の値にして、右側だけを上にずらします。

.left-sidebar #content {
/* margin: 0 4% 0 38%; */
margin: 0 7% 0 34%;
/* width: 55%; */
width: 65%;
 margin-top: -1em; /* ★上にずらす */
}

mkusumeさんのコメント
(1)は解決しました。(2)に関してはまだ確認できていないのですが確認してまた何かありましたら質問させて頂きます。いつもありがとうございます。
関連質問

●質問をもっと探す●



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