タグ

Tipsとfixedに関するnyappawebのブックマーク (1)

  • position:fixedで、左端を親要素基準にする

    メモです。 CSSでposition:fixedを指定した要素の左端を、ブラウザ基準ではなく親要素基準にする方法を知りました。 もしかしたら常識的な事なのかもしれないのですが、つい最近はじめて知ってビックリ。まさに目からウロコでしたw やり方は簡単で、親要素にwidthを指定してmargin:0 autoなどで中央寄せにし、子要素はposition:fixedした上でleftを指定しない(left:autoと同じ)。これだけです。親要素からの距離は、margin-leftで指定すればよいわけです。これで、ブラウザサイズに影響されないで、ある要素の隣にぴったりと追従する(ように見える)サイドバーとかボタンが作れるわけですね。こんな単純な事に今までに気づけずにいたとは。 HTML↓ <body> <div id="parent"> <p id="child">Fixed</p> </div>

    position:fixedで、左端を親要素基準にする
  • 1