首頁  >  文章  >  web前端  >  為什麼固定位置的元件可以與其兄弟元件一起移動?

為什麼固定位置的元件可以與其兄弟元件一起移動?

Patricia Arquette
Patricia Arquette原創
2024-10-24 18:43:26374瀏覽

Why Can a Fixed-Positioned Element Shift with Its Sibling Elements?

為什麼固定位置元素會與其同級元素一起移動

儘管使用position:fixed從文件流中刪除,但元素仍然可以受到其兄弟姊妹的影響。這是由於視窗的計算方式所造成的。

視窗是瀏覽器視窗內使用者可見的區域。它是使用流入元素計算的,這些元素是參與常規文件流的元素。

在提供的 HTML 中,第一個流入元素是

,它有一個 margin-top :90 像素。由於
元素是固定的,在視口計算中不考慮它。

但是,

上的預設邊距 8px 是固定的。元素在
上折疊並帶有邊距。這會導致兩個元素向下移動 90px,影響固定標題的位置。

要解決此問題,只需將 top: 0 新增至標題 CSS 中,將其放置在視窗的頂部,獨立於兄弟元素的邊距。

以上是為什麼固定位置的元件可以與其兄弟元件一起移動?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn