![見出し画像](https://assets.st-note.com/production/uploads/images/143785633/rectangle_large_type_2_e95d6533b7f1c4a5931384eccbf3d360.png?width=800)
【週刊ドットインストール】 レッスン制作の進捗、HTML/CSSを極めるコーナー(仮)
プログラミングにかぎらず、継続や習慣化は普遍のテーマですね…。代表のひとりごとでは「(ランニング継続のコツは)仕事と割り切ること」、そして先日社内では「自分はコレクション性があると続くと気づいて、DotHabit をやっています」というパターンを耳にしました。この場を借りて共有してみます。
さて、今週もドットインストール社内のいろいろをお伝えしていきますね。
レッスン制作の進捗
先週のリリースで PHP のレッスンが一通り終わったので、現在は GitHub Codespaces を使って「Laravel入門」を作り直しています。その第一弾となる「基本操作編」が再来週あたりにリリースできるかな...?という感じです。
![](https://assets.st-note.com/img/1718169673153-LwmOZSYZmr.png?width=800)
またそれとは別に、「Emmet入門」が古くなっていたのでリニューアル版となるレッスンも制作中です。こちらはうまくいけば来週頭にはリリースできそうです。Emmet は HTML/CSS で爆速コーディングができるようになるので便利ですよね。お楽しみに!
HTML/CSSを極めるコーナー(仮)
要素が中央揃えにならない?
質問機能でよくご質問のあるトピックをピックアップする不定期連載です。今回は、中央揃えの使い分けルールについてお話します。
さて中央揃えといえば 「margin: 0 auto」と「text-align: center」 ですね。どちらかを書いてみてうまくいった方にする…のではなく、どんなルールを理解しておけると良いでしょうか?
![](https://assets.st-note.com/img/1718171882415-56Py3CVU6N.png?width=800)
結論としては、以下の三点が使い分けルールとなります。
どちらもブロックボックスにのみ使うことができる
要素自体を中央揃えにしたい → 幅を設定して「margin: 0 auto」をつける
要素の中にあるテキストや画像を中央揃えにしたい →「text-align: center」をつける
少しイメージが難しいので、レッスンから図も引用してみました。
![](https://assets.st-note.com/img/1718172292988-0R6enXEh28.png?width=800)
こういった技術的なポイントも、また(好評そうなら…)不定期にご紹介していきますね。それではまた来週のnoteもお楽しみに!
この記事が気に入ったらサポートをしてみませんか?