せっかくの4連休ですが、なんの予定もありません。まだまだあちこち外出するのは怖いです。しかも連休初日は雨です。散歩くらいはしようと思ってましたが、この雨だとやる気が削がれますね。せっかく暇で、外は雨が降っているので、雨をCSSで表現できたら良…

Flexboxコンテナの左右の余白をいい感じにしたい！でもできない！と悩んだので、それを共有します。最終的に、CSSだけで書くのは諦めてJavaScriptを書きました。悔しい！！ なにを実現したいのか いくつかのアイテムを持つFlexboxコンテナで、左揃えで、画面…

CSSでいろいろ描けるようになっておきたいなという気持ちだけは以前からあったものの、これまでちゃんとキャッチアップできていませんでした。まずは簡単なものからということで、●と▲と■をCSSで描いて、その実装方法について書いておきたいと思います1。 ■ …

See the Pen Full height accordion by gaaamii (@gaaamii-the-sasster) on CodePen. 高さいっぱいのアコーディオンメニューを書いてみた。calc()は幸福度が高い。 こういうの必要なことはちょいちょいありそう。

ちょっと前に、はてなブログのテーマを作った。いや、作ったというか手元にテンプレートをおいていじくったやつを貼っ付けてるといったほうがいいかもしれない。 はてなブログは以下に素晴らしいテーマがたくさんある。 blog.hatena.ne.jp あるんだけど、せ…

https://codepen.io/gaaamii/pen/VgrwMvcodepen.io overflow: visible scroll; と書いたらx方向ははみ出て見えて、y方向はスクロールになってほしいのだけどそうはいかなくてつらいという話。なんでx方向もscrollになるんだ。

と、煽ってるような記事タイトルだけど、 煽りたいわけではなく、単にわからないというつぶやきです。 自分はいまCSS Modulesでやっていて、特に困ることがない。 最近styled-componentsのほうがよく聞くのはなんでだろう。 あっちのほうがなにかいけてるポ…

がっと作った大きなOrganismがあって、それを構成するMolelculeやらAtomやらのレベルのコンポーネントをすべてStorybookに置いた段階で、「あれ、なんかこれいい感じに表示できない...」ということに気付く。CSS Modulesを使ってスタイルのスコープをそのコ…

https://codepen.io/gaaamii/pen/VVaazvcodepen.io 練習。ごく普通なやつです。

「CSS3でアニメーション！」とかいうとなんだか難しいことを新たに勉強する必要があるような気がしてて目を反らしてたんだけど、ちょっと調べてみたらたった２行でいいことが判明。 .hoge a{ display:block; width: 200px; height: 50px; background: black;…

先日公開したアンテナサイト「ソフ速」。アクセス解析を見てみると、どうやらスマホユーザーが半数を超えてる。これはまずい、レスポンシブな感じにしないと...。 ということで昨日2-3時間ほどかけてどうにかしました。想像よりも簡単でした（そう思うのはひ…