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

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

 

找錯鑰匙

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

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