[B! flexbox] kuroaka1871のブックマーク

kuroaka1871 id:kuroaka1871

flexboxに関するkuroaka1871のブックマーク (3)

[CSS]Flexboxのこれが知りたかった！今まで出来なかったことがシンプルで簡単に実装できるスタイルシートのまとめ
今まで出来なかったこと、かなり複雑なコードでスクリプトを併用しないと実装できなかったことをシンプルなHTMLとCSSで実装するFlexboxのテクニックを紹介します。 Solved by Flexbox Solved by Flexbox -GitHub 各コードの対応ブラウザは、Flexboxを使用しているため下記の通りです。 Chrome 21+ Opera 12.1+ Firefox 22+ Safari 6.1+ IE 10+ コードのライセンスはMITライセンスです。「clearfix」「overflow: hidden」から卒業高さが分からないフッタを常に最下部に表示高さが分からない要素を天地左右の中央に配置レスポンシブ対応の3カラムをシンプルなコードで実装 Flexboxを使った柔軟なグリッド入力フィールドとボタンの高さを揃えて、くっつけて配置「clearfix」
kuroaka1871 2016/02/20
css

flexbox
リンク
Flexboxについて勉強したい・理解を深めたいときに参考になるエントリーやサイトまとめ - NxWorld
特に自分がそのように思っていたのですが、Flexboxはレイアウトを組む際に非常に便利なものではあるのですが、非対応のブラウザをサポートする必要があるために安易に使用できなかったり、仕様がころころ変わって対応してたとしてもブラウザによって様々な書き方をする必要があったりで、本格的に使うのはまだしばらく先にとかもう少し様子を見ようと思ってた人も少なくないと思います。ただ、最近では以前に比べて記述する内容も減り、対応していなかったブラウザもサポートを切る機会が多くなったりと今後ますます利用する場面が増えそうなので、先述したようにFlexboxについて勉強したい方やより理解を深めたいという時に参考になると思うエントリーやサイトをまとめてみました。全体的に英語のエントリーなどが少し目立ちますが、Google翻訳などを使えば大体の内容は理解できると思います。 November 16, 2017
kuroaka1871 2015/12/07
flexbox
リンク
CSS3の「フレキシブルレイアウト」使い方まとめフラップイズム
どうも、くーへいです。今回は「レスポンシブデザイン」での使用が想定される、「フレキシブルボックス」についてまとめてみたいと思います。なお、本記事は「CSS Flexible Box Layout Module Level 1」の2014年5月22日付けの編集者草案（Editor’s Draft）を基に作成しています。また、「CSS Flexible Box Layout Module Level 1」は未だに策定中であり、現在は2014 年3月25日付の最終草案（Last Call Working Draft）が最新仕様です。 2014年5月22日付けの編集者草案は、2014 年3月25日付の最終草案に微修正を加えたものです。最初にブラウザの対応状況について注意点「フレキシブルボックス」で検索すると、いくつかの素晴らしい記事が出てきますが、中には古い記事が多く含まれています。「
kuroaka1871 2015/05/21
css3

flexbox
リンク
1