水無月ばけらのえび日記

bakera.jp > 水無月ばけらのえび日記 > first-line 疑似要素に適用できないプロパティ

first-line 疑似要素に適用できないプロパティ

2003年3月11日(火曜日)

first-line 疑似要素に適用できないプロパティ

ジャンル表示を、一行に収まる時だけ右寄せ、二行以上になるときは左寄せにしたいと思ったのですが、うまい方法が思いつかず、試しに以下のように書いてみました。

div.genre p:first-line{
display: block;
text-align: right;
}

ちなみに仕様的には、これは効きません。CSS2 5.12.1 の最後の方に以下のように書かれています。

The :first-line pseudo-element is similar to an inline-level element, but with certain restrictions. Only the following properties apply to a :first-line pseudo-element: font properties, color properties, background properties, 'word-spacing', 'letter-spacing', 'text-decoration', 'vertical-align', 'text-transform', 'line-height', 'text-shadow', and 'clear'.

以上、CSS2 5.12.1 The :first-line pseudo-element より

そんなわけで display も text-align も効かないのが正解なのですが、ものは試しということでやってみました。

それを IE6 で見たら正しく無視されていたのですが、Netscape 7 で見たら、なんと他の部分も含めて全く何も表示されませんでした。適用できないと明確になっているものを無理に適用しようとして変になっているのか、エラー処理の方法がおかしいのか分かりませんが、いずれにしても残念な思いをいたしました。

関連する話題: 出来事 / CSS

最近の日記

関わった本など

インクルーシブHTML+CSS & JavaScript 多様なユーザーニーズに応えるフロントエンドデザインパターンデザイニングWebアクセシビリティ - アクセシブルな設計やコンテンツ制作のアプローチコーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション体系的に学ぶ 安全なWebアプリケーションの作り方 脆弱性が生まれる原理と対策の実践ウェブの仕事力が上がる標準ガイドブック 5 WebプログラミングWeb Site Expert #13Dreamweaver プロフェッショナル・スタイル [CS3対応] (Style for professional)

その他サイト