脚注をセンターに表示することで左右のはみだしを回避
脚注の内容はdata属性に記述、それをCSS関数のattr()で読み込み脚注のbefore属性で表示
ここで使っているattr()関数。HTMLのdata属性をattr(data-text)として読み込み、before疑似要素のcontentプロパティで、content :attr(data-text)と変数のように使う方法は、すでに2010年代には主要ブラウザで実装されていた。
この1~2年、CSSの進化がめざましく、なんか革命でも起きてんの?と感じる毎日です。
それは疑似クラスの:has()を調べてて、『あれ!今までのCSSと違う』っと感じたことが発端です。
この気になるCSS、何が違うって、子要素の状態変化や種類に応じて親要素のスタイルを随時変更可能、つまり設定された要素が周囲の状況を自分で判断し、自律的に振る舞うようになっています。
平たく言えばCSSのIF文。AIは大げさでも、ロジックを持った、考え始めたといっても言い過ぎじゃないです。
私の名はジェミパラ・トラッセンダー。魔法世界『ハピバリアント』の考古学教授だ。
もっかの研究課題は『失われし古代WEB魔法』。もちろん古代魔法だけじゃなく最新の聖CSS魔法にも余念がない。
仕方がないことだが、新しいWEB魔法が登場すると古い魔法は忘れ去られていく。それが世のことわり。
そう思っていたが最近、新しい聖CSS魔法を研究しているうちに、まったく逆の現象が起きていることに気付いた。
何十年も前に策定された魔法仕様の中に、今だからこそ輝きを放つ「古代WEB魔法」が数多く眠っていたのだ。