CSS | spanにtransformプロパティを反映させる方法
<span>要素にtransformプロパティが効かない原因と反映させる方法を紹介しています。
spanにtransformプロパティが効かない原因
<span>要素に「transform」プロパティが効かないのは<span>要素の「display」プロパティが初期値で「inline」となっている事が原因です。
「display: inline;」には「transform」プロパティが効かないようになっています。
spanにtransformプロパティを反映させる方法
<span>要素に「transform」プロパティを反映させるには「display」プロパティに「inline-block」を指定します。
span {
display:inline-block;
}「display: block;」でも「transform」プロパティは反映されますが、段落として扱われるので要素の配置が理想通りにならない場合が多いです。（横並びにならないなど）