css debug 之找錯鑰匙記錄...

同事回報某支網頁程式的bootstrap 下拉式選單會因為太靠近底部而無法使用,如下圖

image

 

找錯鑰匙

   一開始以為這是放的位置問題,所以想說解決方式,應該是加個dropup讓它向上展開。在改的時候,為了全部一起調整,還寫了自動判斷元素若靠近頁尾就自動加上dropup。不過這樣就引起了更多其它問題,例如:當往上時會不會超過Header….。

   和同事討論後,他建議我若解決不了,就暫時不要解決,這句話讓我想到之前看李笑來寫的文章,退一步看,也許鑰匙在別的地方。在參考Yammer的作法時,看到此網頁在最下方層開選單時,會自動撐開下方的高度,為此功能,當下還讚嘆不已!結果在我透過一些基本的實驗後,才發現我跟本一開始就搞方向了,預設bootstrap的選單在頁尾展開時,本來就高度不足時,會往下展高度。所以此問題是使用的theme樣式,在外層加入了個overflow:hidden所引起,不懂原作者為何要這樣作,不過在去參考作者的最新版,此屬性已移除。

 

image

這個網誌中的熱門文章

[.NET Core] 將專案發行至IIS

[TFS] 分支與合併