八月になったばかりだと思っていたらもう月末間近だ。小学生みたいな気分だ。

3:00 キリのいいところまで観たので消灯して寝る。

朝方に雨の音がし始める。かなり強い。窓から吹き込んでいないか確認しに起き上がる。 当然、吹き込んでいる。閉める。また寝る。

10:30 起床。納豆と米を食う。歯を磨く。

外出。雨がうっすらと降っているような気がするが、天気予報を信じて傘を持たない。

イトーヨーカドー曳舟店。体温チェック。

押上駅～三田駅～目黒駅。いったん改札を出る。

12:00 東急の切符を購入。200 円。

目黒駅～多摩川駅～武蔵新田駅。またぞろ雨がポツポツ降っている。 携帯電話で地図を確認して目的地へ向かう。この辺は道が斜めでわかりにくい。

大田区下丸子図書館。一階で産経新聞と東京新聞を読む。 三階の閲覧室の様子を見る。久々に来たら座席が予約制になっている。これはダメだ。 一階に戻って書架のチェック。見て気になる新書数冊のまえがき、あとがき、目次をチェック。 それで退館。

携帯電話の調子が悪く、カメラがなかなか起動しない。再起動をしてようやく撮影ができる。

徒歩で西馬込駅に移動。懐かしの第二京浜の風景。 西馬込駅～泉岳寺駅～押上駅。

15:00 ビッグエー墨田業平店。471 円。

  • 筍ご飯おにぎり (2)
  • 大きなりんごデニッシュ
  • コッペパンチョコ＆ホイップ
  • シーフードヌードル (2)
  • 小粒納豆 (3)

曳舟の部屋。水浴びするには涼しいので、上半身を拭くに留める。 PC を開いてこれを書く。

おやつ。ビデオと写真の編集。携帯電話を再起動したせいで、インポートメニューが表示されない。 これを解決するのに時間を要する。

16:25 歯を磨く。ビデオファイルを最適化する。時間がかかるが、PC がショボいせいかもしれない。

このあと、Twitter にアップロード。OS が重い。 Windows のメモリー解放やら何やら、無駄に時間が飛んでいく。 WSL がメモリーを食いまくるので .wslconfig にスワップゼロ設定を追加。

17:10 YouTube に逃避する。しょぼんのアクションとかいうやつ～の続きを観て時間つぶし。 このステージ BGM がどういうわけか聴き減らない。

19:00 インターネット接続が切断され続ける。原因不明。ルーターもどきのボタンを二度三度長押しして安定させる。

19:50 外出。水戸街道へ。

20:10 コモディイイダ東向島店。437 円。

  • とろろそば
  • ほうれん草エッグ
  • コッペパンコロッケ

曳舟の部屋。シャワーを浴びる。

20:35 風呂を出る。PC を開いて晩飯。

21:10 歯を磨く。今晩のワークは何だ？

Test your skills: Grid - Learn web development に取り組む。21:55 クリア。

Task 1 では容器要素のルールだけを追加的に定義していけばいい。 項目要素を追加して、意欲があれば grid-auto-rows を設定して各項目の寸法を美しくしよう。

Task 2 は項目要素のまたがる格子を決める課題だ。重なり合うことも可能なのだ。 それぞれの項目要素に対して grid-column, grid-column を与える。あのスラッシュを書く記法だ。 素直に書くと Item 2 が上のレイヤーに見える。これを下に見せるには？ z-index ではないだろうし？

Task 3 は Task 2 と意図は同じ。ただし grid-template-areas と grid-area を与えるように指示がある。 ということは、与えられていない項目要素のルールを自分で書くことになる。

Task 4 は FlexBox と Grid の混合コードを扱う。HTML をしっかり分析する。 タグリストについては FlexBox を適用させれば良さそうなので、先に片付ける。 ul 要素に display: flex; flex-wrap: wrap; を指定すると出力例に似る。 残るプロパティー指定 justify-content: center; でタグリストは合致する。 アルバム全体については Grid になる。3 列 2 行の格子を指定するだけだ。gap は指示どおりにする。

フロート - ウェブ開発を学ぶ: float 要素の margin のほうがより効く。 float 要素の周りのボックスに特別なレイアウト処理が施される。 clear は左右両側を指定できるが、細かく区別した験しがない。 空の DIV を書いて clear: both; する代わりにこうする：

.XXXX::after {
    content: "";
    clear: both;
    display: block;
}

あるいは .XXXX の overflow: auto; とする。ただし場合によっては描画が乱れることがある。 そこで現代では display: flow-root; とする。

22:50 スキルテストは明日にしたい。今晩は YouTube を泳ぐ。