asked 9年 ago
冗談ではなく本気で悩んだ結果、先生のお力を借りたいと思いました。
ページの中央配置(左右autoで、ブロックレベル要素の中身は左詰めになっていること)が、
うまくいきません。
必要最低限の画像と、先生のサンプルのCSSをコピペしても、自分の画像データや
CSSのクラス、idをコピペした途端、中央配置できずにいます。
ちなみにパソコンはmacでソフトは「mi」を使っています。開くのはfirefoxかクロームです。
一度サンプルはできたので、今度は応用を活かし自分の求めるサイトを作ろうとしているのですが…一字一句正確に入れても、うまくいきません。
divや親要素、子要素など、多くの専門用語の意味を私が変な風に捉えているのでしょうか？
お忙しい中だと思いますが、よろしく御願いいたします。
1 Answers
狩野 祐東 Staff answered 9年 ago
お返事遅くなりました。
参考にされているのがどの本なのかわかりませんが……
『スラスラわかるHTML&CSSのきほん』ならP.171
『スラスラわかるCSSデザインのきほん』ならP.121
あたりに関連事項が掲載されています。
左右マージンをautoに設定して中央配置をするには、いくつかの条件があります。
- 中央配置したい要素がブロックレベル要素であること（
div,h1,pなど） - その要素にCSSで幅を設定する（例：
width:600px;） - その要素の左右マージンをautoにする
- その要素の1階層上の親要素がブロックレベル要素であること、つまり、直接の親がbodyやdivである。かつ、その親要素がウィンドウ幅一杯に広がるようになっている（幅を指定していない、もしくは
width:100%になっている）
ご質問の内容を見る限りでは、もしかするとHTMLやCSSの記述ミスの可能性もあります（ダブルクオートが抜けているとか、スペースが全角になっているとか）。その辺りも注意して、まずはご自分のソースを確認してみてください。
ごく簡単で余計なもののないサンプルHTMLを作りました。参考にしてみてください。