直近の記事一覧
「サービス維持調整費」 （24年4月23日）
WordPressでHEICが表示されない （24年4月17日）
MacBook Air 13インチ（M3, 2024）の第一印象 （24年4月15日）
Amazon Kindle のポイント還元とゴルゴのセール （23年7月7日）
今まで，WEBのレイアウトには，
「Bootstrap」を使っていたのであまり気にしなかったのですが，
Bootstrapを使わずに，CSSを直うちする場合，
「display:block」と「display:inline-block」を駆使したり，
最近は「display:table」を組み合わせたりしていました。
しかし，そんな面倒な手順より「display:felx」による指定が一番楽だと本日知りました。
例えば，下のような作業も簡単に指定できます。
・要素を等間隔に横並びにする
→ inline-block で，%を指定する必要がない。
・要素を縦で等間隔に並べることが出来る。
→ややこしいCSSを書く必要がない。
なぜ，今まで「display:flex」を使わなかったのか，
時間を大分無駄にしました。
詳しい使い方を簡単に説明しているサイトはこちらです。
日本語対応！CSS Flexboxのチートシートを作ったので配布します
・flex-direction
子要素の並び順です。
（子要素は display:flexである必要はない）
・justify-content
均等割など，配置の仕方です。
あとは，親要素（flex）からはみ出す場合，
（スクロールを設けたい場合）
どのようにするか，が問題です。
＊要素を横並びに，続けて配置したいです。
やってみたら，案外簡単にクリアできるかもしれません。
以上，覚え書きでした。
投稿記事のカテゴリやタグと同じ記事をランダム表示します。