在看張鑫旭大佬的我熟知的三种三栏网页宽度自适应布局方法中，看到了一個神奇的東西，和css中有关负边距（negative margin）的一个问题？提出的問題一樣：float狀態下的負邊距。
根據第二個帖子裏的代碼，最終結果是：
c
margin-left:-100%便可以叠在b上並在左側，但是想讓c叠在a上，不可以magrin-left:-200%，衹能margin-top:-c的高度。張鑫旭大佬帖子裏的第二種排版方法也是這樣。當時看的時候思考了一下爲什麽要
margin-left:-100%，後來看到了這個回答：
個人理解是，c的
margin-left:-100%其實是針對于它的上一層b，因爲b的寬度是100%。但是這個負邊距只針對上一層，如果是上上層則無效。所以c的margin-left:-200%是不會叠在a上。并且如果b、c的位置對調，也是不會實現這個效果的。
同時，在張鑫旭大佬的帖子裏，#right想要浮動在右邊，在#left已經margin-left:-100%的時候，float:right是沒辦法達到效果的，會變成下面這種交錯的場景：
審查元素時我們可以看到，這時候的left其實有一個類似
display:block的效果，它占滿整行，把right擠了下去，但是這時候，display:inline和display:inline-block都沒有效果。
所以以後在運用負邊距的時候要注意佈局的問題，并且就如張鑫旭大佬所説，出現佈局bug，排查不易。
僅供個人新手學習使用。
网友评论