Mac WorldWideWeb

Facebook網頁版瀏覽圖片左側出現的錯誤欄位

近幾個月(應該有半年以上了, macOS 12, 13),當我瀏覽臉書網頁的時候,點入滿版放大圖片時,左側最邊邊外緣不時會出現一排由上往下的字。

用選取來強調出區塊範圍,左側直條就是這個錯誤的欄位。
沒特別選取的情況下是這樣的。

當我結束放大圖片要按左上角的叉叉或是FB按鈕回到上一頁時,抑或是往前一張圖片,這幾個位置就會被浮在上面的這排不明文字給遮住,點下會導向其他頁面。

這排文字內容有:贊助、來去逛逛、Learn More、時間等資訊,用途應該跟廣告有關。

檢視原始碼發現這些內容有刻意要被隱藏,CSS設定讓他往上-10000px移動,可是不曉得什麼原因,每個單位雖然只佔了300x150px大小,但一串資訊累積起來高度超過了一萬像素,所以出現在畫面中了。

為了解決這個惱人的bug,花了幾個小時研究,反覆試驗,將隱藏它的語法寫入到Safari外部載入的樣式表內,這次也學得了新的CSS Selector用法。

div[style="position: absolute; top: -10000px;"] {top: -30000px!important;}

不曉得移動三萬像素會不會不夠?有待時間檢驗。我有用過display: none;,但是很多文章的(發布)時間也會被隱藏掉。