FC2ブログのテンプレ編集/幅調整等・・・。

質問

何度も似たような質問をしています。
毎回丁寧に教えてくださり分かったつもりで
編集を進め出来たと勘違いしておりました。

記事を書き込むとズレたり変なところで切れます。
http://mioka365days.blog.fc2.com/私のブログです。
記事にサムネを載せていますのでアドバイス下さい。

ブログの幅は現状で満足してます。
ただ記事幅の調整方法や編集方法がイマイチ分かりません。

元のテンプレはこちら＞＞＞　giarlspop_locus

記事枠は元のものを使いたいのですが
幅を広げるためには編集しアップロード＞URLの書き換えが
必要だそうで・・・イマイチわからず今のものになりました。

バランス良く見やすい
大きな画像を載せることが出来るように
うまく編集したいのですが、どうも私には理解力が無いようで
毎回コメントくださる方に申し訳ない気持ちでいっぱいです

でもどうしても、きちんと納得いくものを作りたいので
どなたか無知な私でもわかりやすい方法を教えてください。

回答No.2

kobliha · ベストアンサー

ナビの「ホーム」のところ、それは
<!--ナビここから-->
<table width="500" border="0" cellspacing="0" cellpadding="0" class="entry_table">
に当たるので、class="entry_table" を class="entry_table1" のようにして別の名前にする。
スタイルシート増設。
.entry_table1{
width:700px;
margin-bottom: 30px;
color: gray;
}

＞別窓 | ～| under∨

.entry_state {
font-size: 12px;
color: #EEEEEE;
text-align: right; /* right → center に変更 */
margin: 0px 30px 10px 0px;
}

お礼

その後ズレもありませんし
思うようになりました。ありがとうございます。

補足

やってみました。
これでちゃんとできてますでしょうか？

ナビ＜ホーム＞の部分ですが
スタイルシートの増設をしてもしなくても
見た目に変化はありませんでした。
一応付け足してますが、あってますでしょうか？

回答No.1

kobliha

770 の部屋に 970 というピアノを入れようとしたから、右寄りになった。
<!--タイトルここから--> の上にある
<div style="position:relative; width:770px; margin:0 auto;">
これが修正されていないこと。

モダンブラウザでは日付は当初の通り、右揃えになっている。
/* テーブル背景 */
.tdtp1 {
background: url(http://blog-imgs-62.fc2.com/m/i/o/mioka365days/2013071807173076b.png);
background-position: left top;
background-repeat: no-repeat;
width : 500px;
height : 40px;
}

.tdby1 {
background: url(http://blog-imgs-62.fc2.com/m/i/o/mioka365days/201307180717116fa.png);
background-position: left top;
background-repeat: repeat-y;
width : 500px;

}

.tdbm1 {
background: url(http://blog-imgs-62.fc2.com/m/i/o/mioka365days/2013071807173076b.png);
background-position: left bottom;
background-repeat: no-repeat;
width : 500px;
height : 40px;
}

日付は多分この三つの width: 500px; が影響しているので、これも 700px としていない所為。
恐らくあなたのいう「バランス」とやらもその所為が考えられる。

記事の囲みは単純な線でしかないので、
.entry_text blockquote p {
margin: 0px;
padding: 0px;
border-radius: 8px; /* IE非表示 */
}
と同じようなパターンで IE 8 以下は四角の枠線になるが、 IE 9 以上とモダンブラウザは
/*エントリーテーブル */
.entry_table{
width:700px;
margin-bottom: 30px;
color: gray;
border: 2px solid #000000;
border-radius: 30px;
background: #ffffff;
}
で角丸枠線にすることができる。
その場合、先の三つの枠線画像は削除することになる。
あなたより 30px 大きい指定になっているが、角丸はこんなかんじに。（添付画像）
IE 8 以下に対応させるには少しメンドーなことをすることになる。

画像を作る能力があれば、比較的イージー。

補足

一応教えてくださった通りに
できてると思うのですが記事枠下の
HOMEリンクと言うのか・・・

うまく説明できないのですが
そこにも枠ができてしまいました。

これを丸ごと消すか
枠をなくす事はできますでしょうか？
後重ね重ね注文なんですが・・・

別窓 | 未分類 | コメント:0 | トラックバック:0 | ∧top | under∨の部分だけを中央寄せにはできないですか？
よろしくおねがいします