本文へジャンプします。



ココログサポートトップ質問一覧ブログ全体を中央に揃える (スレッド)

解決

ブログ全体を中央に揃える

自分のパソコンでは、ブログの幅をきっちり画面サイズに合わせていて、なんも問題もないはずでした。

ですが、ブログを見ていただく方のパソコン環境によっては、ブログ全体が左寄りに詰まっていて、右側三分の一ぐらいが真っ白になっているそうなのです。

リッチテンプレートだとブログ全体が中央に揃えられるのが当たり前ですが、自作のものを使っているためか、左寄りに詰まった状態です。

中央に揃える方法がありましたら、お願いします。
---
ハニロウ
http://shimizu-pulse.cocolog-nifty.com/
基本情報
  • ご利用中のOSは?:未選択
  • ご利用中のブラウザーは?:未選択
  • ご利用中のプランは?:未選択

インポート | | 固定リンク | その他

Re: [その他]ブログ全体を中央に揃える
ブロックレベル要素をセンタリングするには本来、左右のmarginをautoにすればいいんですが、あいにくシェアが大きいIEがこれに対応していないというバグがあるので、小細工する必要があります。
IEではtext-align: center とすると、テキストだけでなく内側にあるブロックレベル要素までセンタリングしてしまうので、それを利用します。
ただし内側のブロックレベル要素のそのまた内側にあるものも同時にセンタリングされるので、それぞれのtext-alignを適宜指定します。

参考ページ→
ブロックレベル要素をセンタリングする方法 - Web標準普及プロジェクト
http://www.mozilla.gr.jp/standards/webtips0004.html

ココログのリッチテンプレートは、まずbodyにtext-align: centerを指定しているようですね。サンプルページのCSSファイルを取り出して、text-alignがある行を探しながら真似してみてはいかがでしょう。
---
JUMA
http://juma.cocolog-nifty.com/branch/

インポート | |

Re: [その他]ブログ全体を中央に揃える
なんのことやらさっぱりわかりませんので、色々と勉強していきたいと思います。
すいませんでした。
---
ハニロウ

インポート | |

Re: [その他]ブログ全体を中央に揃える
すみません、うちのブログのCSSファイルを改めて確認していて気が付いたんですが、うちのは最初からbodyにtext-align: centerが指定されています……。
ハニロウさんのところのCSSファイルにはこれがないですね。#leftと#rightと#centerの部分の指定から察すると、カスタムテーマの「ページ全般の設定」で「記事表示列」の横幅に“可変”を選んでいらっしゃらないでしょうか。
前回のご質問の時にも書きましたが、これを“500ピクセル”にして下さい。土台のCSSが中央寄せのタイプに変わるはずです。
カスタムCSSはたぶん今のままでいいと思います。もし右サイドバーが一番下に落ちたりするようでしたら微調整が必要になりますが。
---
JUMA
http://juma.cocolog-nifty.com/branch/

インポート | |

Re: [その他]ブログ全体を中央に揃える
わざわざブログにまでお越しいただき、大変ありがとうございました。
おかげで上手く調整ができました。
とても助かります。
感謝感激です。
---
ハニロウ

インポート | |