7cc@はてなブログ

JavaScriptとかとか

CSS transformが効かない

CSS transformの適用される要素は決まっていて、仕様ではtransformable elementsと呼ばれる。 そのため、他の要素に使おうとしても効かない。

transformable elements(変形可能要素) = transformが使えるよ

  • Block-level elements (divとか)
  • atomic inline-level boxes:
    replaced inline-level elements, inline-block elements, and inline-table elements
    (置換インライン要素: img, input, buttonなど)
  • CSS display: table-* が指定された要素
  • SVG (IE9だと効かない)

つまり適用されない要素は

  • 普通のinline要素 = 非置換インライン要素。span, em, など。
  • あとは・・・何だろう?

参照