・掲載画像はクリックで拡大するものもあります。
・配布素材(アイコン・バナー)以外の画像、及び文章の複製・転載はご遠慮下さい。→詳細
記事タイトルと日付を左右振り分けて横並びにする方法として、以前FC2ブログのテンプレート工房様の管理者用記事編集リンク のコメント欄にて、「テーブルでやりました」などと書いたことがあるのですが、その後文法チェック(Another HTML-lint gateway)なるものを知ってしまい、エラーが出まくることが判明した為、外してしまいました。
そして直し方が分からないまま半年経過。
で、さっき閃いた。(大袈裟な言い回し。)
スタイルシートでやればいいじゃん。今までなんで気が付かなかったんだろ。馬鹿じゃね私(゚д゚)
と言うわけでタグを貼っておきます。(続きを読むからどうぞです。)
【HTML】
赤文字を追加します。
元々あった場所の日付の行は削除(二重表示になりますので)
<!--▼▼ メイン表示 ▼▼-->
<!--▼ エントリー(記事)▼-->
<!--topentry-->
<div class="ently_outline">
<h2 class="ently_title"><div class="entry_date">
<%topentry_year>/<%topentry_month>/<%topentry_day>(<%topentry_wayoubi>)
</div>〜
</h2>
【スタイルシート】
赤文字を追加します。「記事」部分に入れておくと後々作業しやすいかと思います。
御自分のブログのデザインに合わせて数値等の変更をして下さい。
/*** ▼ 記事 ▼ ***/
〜
.entry_date{
font-size:10pt; /* 文字サイズ(日付) */
color:#ffffff; /* 文字色(日付) */
padding: 0px 0px 0px 0px; /* 文字位置 (上・右・下・左) */
background-color:#000000; /* 背景色(日付) */
float: right;
}
/*** ▲ 記事 ▲ ***/
【注意書き】
1. 文字サイズ・色・位置等はお使いのテンプレートに合わせて下さい。
2. テンプレートによってはこのタグが有効でないことがあります。
3. 何はともあれ「topentry」部分を探して、色々試してみると良いと思います。
4. 必ず「複製」してバックアップを取っておいてから弄り倒しましょう。
5. 「出来ねえよ!(`Д´メ)」とか「分かりません」とか言われても困ってしまいます。
6. テーブル使うよりマシですが、文法チェックでエラーが出ます。(号泣)
【動作確認】
○…IE・Opera・Firefox・safari
「文法チェックで引っかかるのは嫌だけど左右には振り分けたい!」
と言う私のような方は、HTML部分を
<!--▼▼ メイン表示 ▼▼-->
<!--▼ エントリー(記事)▼-->
<!--topentry-->
<div class="ently_outline"><div class="entry_date">
<%topentry_year>/<%topentry_month>/<%topentry_day>(<%topentry_wayoubi>)
</div><h2 class="ently_title">
〜
</h2>
として、スタイルシートの文字位置の数値を変更して下さい。
【関連記事】
「続・スタイルシートでタイトルと日付を左右に振り分け」
≪健康診断・嫁編 | HOME | 献眼登録&臓器提供意思表示(登録)カード≫
この記事へのトラックバックURL(内容確認後の表示とさせて頂いております。)
http://tanpoko.blog70.fc2.com/tb.php/683-2186734c
|
|
|
| ※旗は拳斗会の時のものです。 |

【書籍掲載】
JK Fan 空手道マガジン
2007年1月号
「ようこそ JK Blog&HP」
【管理人】 chan (掲示板)
![]() | |