テンプレートの修正について

いろいろと書いてありますが

この文章や、サブタイトルなども含め、取り扱い説明の文章を、ご自分のサイトの内容に置き換えて使用してください。

お勧めする方法は、まずダウンロードしたこのテンプレートファイル一式を別にコピーし、見比べながら変更を行っていく方法です。

レイアウト崩れについて

各IDやクラスで指定している横幅：widthや余白:paddingの数値を変更するとレイアウトが崩れる場合があります。stylet.cssの中身を変更する際はお気をつけください。一番無難な方法は変更しないことです。

他テンプレートサイトとの合体等は行っていただいて構いません。ですが、同一のID名やクラス名を使用している等によりレイアウト崩れが起こる場合があります。その際は、ID名やクラス名を変更してください。

ブラウザ互換性について

できるだけ多くのブラウザで表示テストを行っていますが、古いヴァージョンやこちらが把握していないブラウザなどでは上手く表示されない可能性があります。

場合によってはレイアウトの崩れが起こる可能性があります。その時は、ご自分のブラウザに合わせ、CSSファイルの修正を行ってください。こちらで対応することはできません。

emについて

emとはpxや％と違い、文字の幅や高さによって動的に設定される横幅・縦幅になります。pxと違い、文字の大きさによってデザインがずれるということが起こりますが、文字を縦方向に中央表示させたい場合などに向いています。

ただし背景画像を使用しての幅の指定には向いていません。（背景画像は必ずpxだからです）。

このサイトテンプレートは基本的に <br />での改行を行うことを想定していません。<br />で改行を行うと、頭落ちを行わない文章となります。

改行を必要とする文章は<p>～</p>で囲うようにしてください。

stylet.css　メニューリンクの指定

#menu ul {
　　・
　　・
　　width: 700px;　←一番外枠の指定
　　・
　　・
}

#menu li {
　　・
　　・
　　width: 132px;　←メニュー１つ１つの指定
　　・
}

メニューは現在横幅700pxで指定されており、リンク１つ１つの横幅は100pxとなっています。

リンク１つの横幅の計算の仕方は100+１（ライン幅） = 101px がリンクの１つの幅となり、これをリンクが欲しい数だけかけて実際の横幅は算出します。

このテンプレートの場合、適正なメニュー幅は　101×6（リンクの数）－１ = 605px を指定すると、右に余分が出なくなり綺麗なメニューリンクとなります。最後に１を引くのは、メニューの最後には右のラインがないためです。

メニューの幅を変更したら#pageの横幅も同時に変更しましょう。無駄な余白がなくなります。