インライン要素にwidthとheightを指定して、無視されるとき／されないとき
update:2008.3.12
ノートにあとで調べるとしておきながら半年以上放置
調べたら「非置換インライン要素」がわかった。以下まとめ。
仕様では・・・、widthとheightが指定できるインライン要素
５つある。このタイプのインライン要素を「置換要素」と呼ぶ
- img要素
- input要素
- object要素
- select要素
- textarea要素
- button要素
仕様では・・・、widthとheightが指定「できない」インライン要素
これらを総称して「非置換インライン要素」と呼ぶ。
- 「置換要素」以外の全てのインライン要素
- span要素とか。
じゃあ実装では置換要素と非置換インライン要素はどうなる？
仕様通りなら仕様だけ確認するだけでいいのだか・・・・
「後方互換モードのIE」（IE7,IE6,MacIE）で、ダメ（仕様通り実装されてない）。
指定したwidthとheightが全てのインライン要素で有効になる
「後方互換モードのIE」is・・・（ざっくり）
参考記事
- //w3g.jp/css/guide/target#replace:button" target="_blank">適用要素:button要素がどういうわけか、置換要素から除外されて記述されていた。
- //2xup.org/sample/displaymode/" target="_blank">displaymode check sample:「ウェブ標準の日々」の配布資料。No.12 0辺り。
- //reference.sitepoint.com/css/replacedelements" target="_blank">Replaced Elements:SitePoint CSS Referenceより。
参考文献
- 『
- //www.amazon.co.jp/exec/obidos/ASIN/4798010928/clientsidescr-22/ref=nosim/" name="amazletlink" target="_blank">Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト』:最初に調べるときに手に取った本。役に立たなかった。置換要素／非置換インライン要素の区別については記載されているのだが、索引からは、辿れないページに書かれている（p.179）。改訂時にこの辺りの不備を改善してほしい。
- 後方互換モードのIEでは非置換インライン要素へのwidth／height指定が有効になること
- button要素も置換要素であること
上記については書かれてなかった。
Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト
posted with amazlet at 08.11.20
- 『
- //www.amazon.co.jp/exec/obidos/ASIN/4774136840/clientsidescr-22/ref=nosim/" name="amazletlink" target="_blank">実践 Web Standards Design ~Web標準の基本とCSSレイアウト&Tips~』:有名本。最初に販売してた出版社が潰れて別の出版社から再販売されてる。自分が参照してるのは旧出版社版。
- 置換要素／非置換インライン要素については、言葉は頻繁に使われているが説明は見つけれなかった
- 当然索引から辿って調べることもできない。
- 言葉の説明のポリシーはどうなってるんだろう？
- 出版社のサポートページの正誤表には載ってなかったが、誤植発見
- 「Appendix2. DOCTYPE スイッチの一覧表」pp.410-411。下記のXHTML1.0 TransitionalのDoctype宣言を付けた場合に、IE6が後方互換モードになると書いてる。
実践 Web Standards Design ~Web標準の基本とCSSレイアウト&Tips~
posted with amazlet at 08.11.20
