SPYWEBUIスニペットフロントエンドJSプラグインWordPressScss(Sass)入門講座バックエンド人気記事JSでiOSにも配慮した背景固定なスクロール対応のモーダルウィンドウCSSで游ゴシックやメイリオなどのfont-familyを指定するときのベストプラクティスIE8〜11/Edge12〜の各バージョンに対応したCSSハックまとめCSSで簡単に縁取りされたアウトライン文字を作るCSSでスクロールバー非表示とJSでスクロールバーのデザインをカスタマイズするJSでtouchstartとclickイベントを2回発生させないようにしつつ同時に指定するドラッグ&ドロップで要素を並び替えることができるSortable.jsJSでブラウザがリロードされたかどうかを判定する22個のサンプルから学ぶCSSのnth-child()を使った番目を指定するテクニックSVGでtext要素を上下左右中央寄せする2017.09.19CSSで余白は自動調整される上下左右中央揃えの方法4つとその違いよく使用するCSSのテクニックとして上下左右中央があります。色々なWebサイトで紹介されていますが、あまり使わない方法まで紹介されていて少し混乱します。指定しなくても内容に応じて自動調整される方法のみを紹介します。15em;}上下方向は高さを指定しないと中央揃えできないので指定しています。自分自身の要素を基準とした値です。すれば親要素の幅にすることができます。優秀で一番柔軟性が高いです。IE10から対応しています。余白が自動調整されます。それぞれの違いは何か4つの方法を紹介しましたが、それぞれ違う方法で表現しているのでもちろん違いがあります。違いは、指定した高さよりコンテンツが多い場合の挙動です。この特性に気をつけて、場合によって使い分けます。transform>はみ出て中央寄せになります。table-cell>親要素の高さが子要素のコンテンツに合わせて伸びます。center>はみ出て中央寄せになります。margin>上揃えではみ出ます。自分がCSS学びたての頃にもっとはやく知りたかったテクニックを載せています。CSSの基礎知識について解説していないので、中級者〜向けとなります。CSS入門書を読んではみたものの、思い通りに作れない人にオススメです。HTML/CSS/JS/PHPを扱う、Web制作が大好きな22歳。ブログには備忘録としてつまずいたりハマったりしたことを残しています。今後は各種プラグイン開発もまったり行なっていきます。