こんにちは。
数値の設定で直ると思います。
以下、変更・追加部分を記します。
(1)
common.css 275行目
paddingの左を 0 にすると左は揃いますが、右がずれます。
画像bg_sidebar_primary_column_shadow.pngのサイズを調整する必要があると思います
#primary aside {
padding: 20px 5px 10px 0px;
}
(2)
common.css 410行目
a要素の幅、背景画像の位置を指定してpaddingの値を調整
.continue-button a {
background-position: right bottom;
width: 80px;
padding: 9px 12px 7px 12px;
}
(3)
#footer-containerにボーダーの指定、paddingの調整
別のスタイルシートに同じセレクタの指定がありますが、特に理由がなければ
まとめてしまったほうがよいかと思います。
common.css 381行目
#footer-container {
border-top: 30px solid #0000f6;
}
layout.css 65行目
#footer-container {
padding-top: 10px;
}
bujin450 さん、親切にどうもありがとうございました。返事が遅くなってすみません。
大変助かりました。
２点目はうまくいきました。
１点目、左は揃いました。画像を修正したのですが、右が微妙にずれています。これは画像の方で修正するしか無いのでしょうか？横幅は同じ250pxにしているのですが。
３点目、
layout.css 65行目
#footer-container {
padding-top: 10px;
はcommon.cssの方へ移動させました。
しかし、まだ思ったように一番下に太い青い線が行きません。すみません、もう少し教えて頂けませんか。よろしくお願いします。
こんにちは。
下に青い線があったのですね。左にもあるようですが。
以下でどうでしょうか。
#footer-container {
margin-bottom: 15px; ← 線の下にスペースができるのでなしか値を0に
border-top: 30px solid #0000f6;
border-bottom: 5px solid #0000f6; ←下のボーダー 値は適当に変更してください
border-left: 5px solid #0000f6; ←左のボーダー
padding-top: 10px;
}
#footer {
height: 16px; ←この指定をしていると下のボーダーが上がってしまいますので無しか数値変更
}
bujin450 さん、親切にどうもありがとうございました。返事が遅くなってすみません。
大変助かりました。
何度もすみません、まだ空間が空いてしまいます。
すみません、どうか教えて頂けませんか。
また、１点目、右が微妙にずれてしまうのは、画像ファイルそのものの修正が必要なのでしょうか。
どうぞよろしくお願いします。
＞何度もすみません、まだ空間が空いてしまいます。
空間があく、というのはどこになりますか？
フッターの絵と最下部ラインの間であればこれで無くなります。
p#copyright {
margin-bottom: 0;
}
＞また、１点目、右が微妙にずれてしまうのは、画像ファイルそのものの修正が必要なのでしょうか。
2つの背景画像の横サイズは同じ250pxですね。
このボックスの幅が微妙に250pxより広いので背景がリピートしてずれて見えているようです。
背景画像をY方向のみリピートすると見た目上は一致します。
余白があるので何かの時に悪さするかもしれませんが。
#primary ul, #primary div {
background-repeat: repeat-y;
}
bujin450 さん、ご親切にありがとうございます。
なんとか再現できました。
本当に助かりました。
本当にありがとうございました。
