【CSS】positionの指定をリセットする

cssのコーディングをしている時、全体要素(親要素)に適応していたpositionの指定(absolute、relative、fixed)を、子要素のclassやidの時にリセット(キャンセル)したいことってありませんか?

今回はそのpositionをリセットしたい場合の方法を記載します。

もくじ

position指定のリセット方法

position指定のリセット方法はとても簡単です。

子要素のpositionにstaticと指定することで、positionの指定をリセットできます

例えば、h2全体にしていたposition:absolute;をしていて、あるクラス(子要素)のh2だけpositionを変更したい場合、子要素にposition:static;を指定することで、子要素のpositionの指定をリセットします。

//全体要素(親要素)
h2{
   position:absolute;
   top:0;
   left:0;
}

//子要素
.children.h2{
   position:static;
}

まとめ

positonの指定をリセットする方法は、positionにstaticと指定することでした。