2019.02.24こんにちは、ゆんつです。CSSで画面中央に文字を配置するセンタリングをしたい場合。centerを使うことが一般的だと思います。時と場合によっては、text-align:centerではセンタリングできないケースもあります。centerにしてもセンタリングが出来ないときには結構悩みました。auto;の原理について書き残しておきます。centertext-aliginというプロパティはブロック要素の中のインライン要素に効果を及ぼします。ブロック要素は幅を明示的に指定しない限り、画面の左端から右端までが要素の幅になります。center」によりそのブロック要素の中にあるインライン要素がブロック要素の中央に来るので、結果として画面の中央に文字がセンタリングされるのです。ブロック要素自体が画面の真ん中に移動しているわけではありません。ゆんつブロック要素自体は動いてないよですのでブロック要素に画面より狭い幅を指定した場合。centerでは画面の中央に配置することができなくなります。auto;を使うことになります。auto;marginプロパティは隣り合う要素との距離を調整する役割を持ちます。幅が設定された要素の左右のmarginをautoにすると、その要素の左右のmarginは自動計算されて左右に均等に振り分けられます。結果として要素自体が画面の真ん中に配置され、text-align:centerも設定されていればちょうど画面の中央にセンタリングされて見えるようになります。auto;はブロック要素自体を動かして真ん中に配置することが大きな違いです。auto;は幅が設定された要素自体を画面の中央に移動させるですね今はこの仕組みが分かったので簡単に左右方向のセンタリングができるようになりましたが、最初は仕組みを理解せずに「text-aligin:centerって書けばなんでも中央揃えになる!」と思い込んでいたので、text-aligin:centerで画面中央に揃わない時は頭が混乱することが良くありました。原理さえわかってしまえば、なんてことはないですね。ゆんつ本日は以上ですそれでは、またですー。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。コメントデータの処理方法の詳細はこちらをご覧ください。プロフィールこっそりゆんつ山口県在住です。Reserved.メニューHOMEプロフィールお問い合わせホーム検索トップサイドバープロフィールこっそりゆんつ山口県在住です。(17)エックスサーバーで。