css屬性「左」還是「右」會影響網頁上的其他元素

Question

標題相當自我解釋。其他細節要考慮的是...

元素我申請的CSS來將position:relative

的元素將被嵌入到網頁

我使用left: -9999px移動的元素暫時關閉屏幕

元素可能會移動或不移動'over'或'through'頁面上的其他元素。

這樣做是否會產生負面影響，例如更改頁面上其他元素的佈局/佈局？

由於

Answer 1

在大多數情況下，偏移相對定位的元素不會影響同一流程中其他元素的佈局，因爲其他元素只會尊重元素的「原始」位置（即，如果它尚未抵消）。偏移屬性僅對要偏移的元素產生視覺效果。從spec：

一旦一個箱子按照正常流量佈置或浮動，它可能會相對於這個位置移動。這被稱爲相對定位。以這種方式偏移一個方框（B1）對下面的方框（B2）沒有影響：給出一個位置，就好像B1沒有偏移一樣，並且在應用B1偏移之後B2不重新定位。這意味着相對定位可能會導致框重疊。

然而，該規範確實指出的邊緣的情況下（在上述部分後立即）：

...但是，如果相對定位導致「溢出：自動」或「溢出：滾動'框溢出，UA必須允許用戶訪問這個內容（在它的偏移位置），通過創建滾動條可能會影響佈局。

例如，滾動條可以減少容器的寬度並導致其他元素包裹在他們不知道的地方。

Answer 2

號

從MDN：

相對

此關鍵字勾畫出的所有元素，就好像元件未定位，並且然後調整元件的位置，而不改變佈局（因此留下一個如果它沒有定位的話，元素的缺口）。位置：相對於表的效果 - * - 組，錶行，表列，表格單元和表標題元素未定義。

正如你可以在這個Demo看到，relative LY定位的元素簡單地重疊的其他元素，在不影響原有的佈局 - 其他元素保持原樣以前（比當前它的重疊，明顯的事實其他）。