昨日ついに！ 納車しましたハイエースワゴン！ 新古車だったから早いけど、これを正規でトヨタに頼むとちょっと時間がかかるみたい。 我が家がFLEXにした理由は ・早く納車したかったこと ・丸目ライトがいいという希望があったこと ・車中泊使用にしたかったこと 本当は色もこだわってバイカラーとかしたかったんですが… お金がなく断念。 １０年ぐらい乗って、ローンがなくなったら考えようかなと思っております。 昨日はFLEXに車を取りに行って、その足でコストコに買い物へ行き、そこからkeeperにコーティングをしてもらいに行って、その間ラウンドワンに行って３時間遊んで帰宅。 平日だし、ポンポコも一緒に行っ…

リストの間隔は gap で指定したい場合、flex だと各アイテムの width を設定しなければならず面倒 例えば上記の画像のように gap: 24px で 3つ並びにしたいと思った場合、リストアイテムの width を 33.333% にするとアイテム間の間隔分が足らず 100% を超えてしまうので 2 つで折り返してしまう。 この程度のことに calc を使うのも計算量が増えるので避けたい grid を使って折り返しのあるリスト表示を実現する .list { display: grid; grid-auto-flow: row; grid-template-columns: repeat…

Flex. フレックス

IE11のサポートが切れた今、そろそろgridレイアウトを積極的に導入でるようになりました。flexレイアウトからgridレイアウトへの移行をデザイナー観点で簡単に使うとこだけ解説します。 gridレイアウトの利点 gridだと列数だけでなく行数も指定しないといけないと思われがちですが、実際は列数の指定だけで行が増えても繰り返してくれます。どっちが行だか列だかわからなくなったときはテキストを思い出してください。 テキストエディタで行番号をふれるのが行です。gridのメリットは色々ありますが、flexboxレイアウトより優れている点は下記の三点です。 親要素で子要素のサイズを制御できる 子要素側…

2022年6月から7月の備忘録。 といってもあまりに仕事だなんだがつまりすぎて、なーんにもできてない。プライベート? 何それ。 というわけで、当然模活もできようはずもなく、先月買ったHMAの2機も先々月買った朽ちダグラムも手を付けかけていたガンダムアーティファクトのザクIIIもなーんにも進んでません。はい。 そんな中、唯一というのが手持ちマシンのChromeOS化。ChromeOS Flexが正式リリースされたとのことで、アーリーアクセス版から試していてそこそここれは使えるんじゃね? と思いサブ機に入れることとした。や、メイン機のトラブルに備えてWindows環境は残したままにする必要はあるの…

横並びの方法はいろいろありますが、わたしはいつもdisplay:flex;を使用しています。 まあ手軽だし使い慣れてきたし…と思ってたんですが、そろそろ他のやり方も研究しようと思って、floatとtableパターンを作ってみました。

寒くもなく暑くもなくちょうど気持ちいい日鶴見緑地公園へ 久しぶりのみんなの笑顔元気そうで何より帰りにちょっと寄り道たまたま閉店セールをやってたのでついついあれこれ 膝掛け・ストール・写ってないけどピアスも コースターいろいろ70%OFFって言われちゃったらねぇ明らかに買いすぎだわ