[解決済み】要素を親からの相対的な位置に固定することはできますか?[重複している]。
2022-03-27 07:14:06
質問
<余談
ある要素を固定配置すると、親が相対配置されていても関係なく、ウィンドウに対して相対的に固定配置されますね。
#wrapper {
width: 300px;
background: orange;
margin: 0 auto;
position: relative;
}
#feedback {
position: fixed;
right: 0;
top: 120px;
}
<div id="wrapper">
...
<a id="feedback" href="#">Feedback</a>
</div>
解決方法は?
両方の質問にお答えします。あなたの既存のタイトル(および元の投稿)は、あなたが編集とその後のコメントで求めているものとは異なる質問を投げかけていることに注意してください。
親要素に対して相対的に配置する場合
が必要です。
position:absolute
を子要素に、親要素にデフォルトまたは static 以外の任意の位置モードを指定します。
例えば
#parentDiv { position:relative; }
#childDiv { position:absolute; left:50px; top:20px; }
これは
childDiv
要素を、parentDivの位置から左に50ピクセル、下に20ピクセル相対移動させます。
要素をウィンドウに対して相対的に配置する(quot; fixed"
が必要です。
position:fixed
を使用することができます。
top:
,
left:
,
right:
および
bottom:
を自由に配置することができます。
例えば
#yourDiv { position:fixed; bottom:40px; right:40px; }
これは
yourDiv
は、ウェブブラウザのウィンドウに対して、下端から40ピクセル、右端から40ピクセルの位置に固定されています。
関連
-
[解決済み】Text-decoration: noneが機能しない。
-
[解決済み] divを親の中で自動的に縦に重ねるにはどうしたらいいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] 要素を水平方向にセンタリングする方法
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] どのDOM要素にフォーカスがあるかを調べるには?
-
[解決済み] jQueryで名前を指定して要素を選択するには?
-
[解決済み] 位置は固定だが、容器に対して相対的
-
[解決済み] Position: fixed" の div の幅を親 div からの相対値で設定する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン