Flexboxの特性をうまく使い、Media Queries無しでレスポンシブ対応のレイアウトを作成するCSSのテクニック

非常にシンプルなHTMLで、Flexboxの特性をうまく使い、Media Queries無しでレスポンシブ対応のレイアウトを作成するCSSのテクニックを紹介します。 スマホ時はサイドバーを下に落とすレイアウトなど、利便性が高いと思います。 Using flexbox to make responsive widgets without media queries. デモでは、デスクトップの2カラムでは右のカラム（ピンク）が300px固定で、左のカラム（グリーン）が最小幅400pxを下回ると、垂直方向に積み重なります。積み重なった時は、2つのカラムは100%で表示されます。

[yorozuna]

これだけだとあんま意味ない気がするけど、細かいとこで利用法はありそうメモ。

[bleu-bleut]

flex-basisを設定することでメディアクエリ無しを実現できるが、実際はフォントのサイズとかも変更しないといけないので、メディアクエリを使わないわけにはいかないかな？

[sona-zip]

正しく理解できてないけど今時のスマートフォンはPCより解像度が高い場合があるから、400pxだからレイアウトを変えるでスマートフォンに対応できる意味が理解できない