浜松市を拠点に静岡県西部にてWeb,デザイン,写真撮影〜を行っております。SOHOならではの身軽さと適正料金にてお客様の企業価値向上に取り組んでいます。サイト制作・管理、カタログ・広告デザイン、撮影等までお気軽にご相談下さい。



---お買い物用---

2019年9月13日

親要素の横幅でposition:fixedの位置を固定する

Filed under: Web & Design,備忘録 — Cript @ 1:42 AM

文章で説明するのがめんどーなのでw 図を見て頂きたいんですが、簡単なようで結構試行錯誤したのでその備忘録

通常普通にposition:fixedで書いちゃうとブラウザの絶対位置基準で配置されてしまうのでright:0とかすると#wrapper内にあってもブラウザの右端にくっついてしまうわけです。

んで、いろいろ試行錯誤した結果。
ブラウザの半分の値-#wrapperのピクセル値の半分をcssで計算してあげればなんか上手くいったw
position:fixed;
right: calc(50% – 450px); /* 親要素が900pxの場合 */
です。

この方法が正しいかは知らないwww(識者の方いらっしゃいましたらゼヒ教えて下さい<(_ _)>)

No comments yet.

RSS feed for comments on this post. TrackBack URL

Leave a comment