Flexboxでスマートニュース(SmartNews)風のレイアウトを実装する方法

かなり前に、スマホ版の関連ニュース一覧の表示をスマートニュース(SmartNews)風にしたいな〜と思い、Flexboxを使って実装してみました。その当時はちょうどFlexboxを覚えたばかりで、個数や画面幅が変わっても柔軟に対応できるのを知って大変感動したのを覚えています。
というわけで、今回はそのとき感じた「知ってよかった!」の気持ちを振り返りながら実装方法をメモしておこうと思います。
続きを読む最近、会社のサイトをリニューアルする機会があったんですが、サムネイルのサイズがみんなバラバラ!ってことがあったんですよね。今まではそれを横幅だけ揃えて高さはバラバラなまま表示してたりして、なんだか統一感のないデザインだったんですが、そんな悩みを解決してくれるcssを覚えたので、メモとして書き残しておきます!
画像の可変幅にも対応できているので、レスポンシブWebデザインにも使えますよ!
続きを読む