やわらかしかっけい

なんでもすぐに忘れてしまう自分のために

レスポンシブの時にpositionの指定を変えたい

たとえばtop指定→bottom指定に

大画面の時は上部に、スマホは下部に表示したいな〜っていうとき

nav {
  position:fixed;
  top:16px;
  left:16px;
}

@media screen and (max-width: 600px){
  nav {
    bottom:16px;
  }
}


ってすると、bottomが効かない。
topが優先されちゃう。

unset というソリューション

top:unset; とすればよい。

nav {
  position:fixed;
  top:16px;
  left:16px;
}

@media screen and (max-width: 600px){
  nav {
    top:unset;
    bottom:16px;
  }
}

こういう簡単なことでもハマると時間を喰うから、メモっておく